MCP لتوليد الصور في Claude Code: الإعداد وأفضل الخوادم

يكتب Claude Code صفحاتك لكنه لا يرسم صورها. يشرح هذا المقال كيفية تسجيل خادم MCP لتوليد الصور، واختيار النطاق المناسب، ومقارنة أكثر الخوادم استخدامًا، وربط PicassoIA للصور والفيديو، مع حلول للأخطاء الشائعة.

MCP لتوليد الصور في Claude Code: الإعداد وأفضل الخوادم
Cristian Da Conceicao
مؤسس Picasso IA

يستطيع Claude Code بناء صفحة هبوط في دقائق، لكنه لا يستطيع رسم الصورة الرئيسية لها. إذا طلبت بانرًا أو نموذجًا لمنتج أو مجموعة من الصور المصغّرة للمدونة، ستحصل على كود SVG أو مسار نائب، أو عبارة "لا أستطيع توليد الصور". يسدّ خادم MCP لتوليد الصور هذه الفجوة. بعد تسجيله، يستدعي Claude Code نموذج الصور كأداة، ويحفظ الملف داخل المستودع، ويدمجه في ملف HTML أو markdown الذي يعدّله أصلًا، وكل ذلك في جلسة واحدة.

يوضح هذا المقال كيفية ترابط الأجزاء، والأوامر الدقيقة لتسجيل الخادم، ومقارنة جنبًا إلى جنب للخيارات التي يستخدمها الناس فعلًا، وكيفية ربط موصل PicassoIA للصور والفيديو معًا. تتبع الأوامر الوثائق الحالية لـ Claude Code. وأي شيء لم أستطع التحقق منه، مثل عنوان URL خاص لخادم، يظهر كعنصر نائب بدلًا من تخمين.

لماذا يحتاج Claude Code إلى أداة للصور

الفجوة لدى وكيل يعمل بالنص فقط

يعمل Claude Code في الطرفية، يقرأ ملفاتك، ويشغّل الأوامر، ويعدّل الكود. هذه الحلقة سريعة حتى تصل إلى أول وسم <img>. عندها تغادر الجلسة، وتفتح مولّدًا منفصلًا، وتنزّل ملفًا، وتعيد تسميته، وتضعه في المجلد الصحيح، ثم تلصق المسار مرة أخرى. كل قفزة من هذه تكسر تدفق العمل، والأمر النصي الذي كتبته لا يرى الصفحة التي كان مقصودًا بها.

يدا مصمم تكتبان على مكتب، وخلفهما صور مطبوعة مثبتة على لوحة فلين

ما الذي تضيفه طبقة MCP

MCP، أو Model Context Protocol، معيار مفتوح يتيح لعميل الذكاء الاصطناعي استدعاء أدوات خارجية. يعرض خادم الصور أداة واحدة أو أكثر، عادةً بشيء مثل generate_image، ويعرضها Claude Code تحت اسم قابل للتوقع: mcp__<server-name>__<tool-name>. الخادم المسمّى image-gen الذي يحوي أداة generate_image يظهر باسم mcp__image-gen__generate_image.

مع هذا الإعداد، يُنجز طلب واحد المهمة كاملة:

  • يقرأ Claude Code الصفحة ويكتب أمرًا نصيًا للصورة يناسبها
  • يرسل الخادم الأمر النصي إلى مزوّد النموذج
  • يصل الملف إلى مجلد مشروعك، أو يُعاد رابط URL
  • يعدّل Claude Code الترميز ليشير إلى الصورة ويكتب النص البديل لها

💡 نصيحة: اجعل اسم الخادم قصيرًا وبأحرف صغيرة. ستراه في كل استدعاء أداة وفي كل طلب إذن، وimage-gen أسهل في القراءة من اسم منتج طويل.

كيف يعمل الربط

العميل والخادم والمزوّد

تشارك ثلاثة أجزاء، والخلط بينها يسبب معظم الارتباك في الإعداد.

الجزءما هومثال
العميلالتطبيق الذي يستدعي الأدواتClaude Code
الخادمعملية أو نقطة نهاية مستضافة تتحدث بروتوكول MCPmcp-image، موصل PicassoIA
المزوّدالمنصة التي تشغّل نموذج الصورOpenAI، Google، Replicate، PicassoIA

الخادم هو المترجم. يستقبل استدعاء الأداة من Claude Code، ويحوّله إلى طلب يقبله المزوّد، ويعيد النتيجة. يدعم Claude Code أربع طرق نقل: stdio، وhttp، وsse، وws. عمليًا تختار بين اثنتين. stdio يشغّل عملية محلية على جهازك، عادةً عبر npx. أما http فيشير إلى عنوان URL بعيد يديره شخص آخر.

رسم بقلم رصاص في دفتر لثلاثة صناديق متصلة بأسهم، على مكتب من خشب البلوط

أين تستقر الصورة

تتعامل الخوادم مع المخرجات بطريقتين، والفرق مهم. بعضها يحفظ الملف على القرص ويعيد المسار. يكتب mcp-image إلى مجلد تحدده، ويعيد create-image-mcp بيانات وصفية للملف بدلًا من بيانات base64. وبعضها الآخر يعيد رابط URL أو بيانات صورة مضمّنة.

تنص وثائق Claude Code على أن الصور في نتائج الأدوات تُحتسب ضمن حد MAX_MCP_OUTPUT_TOKENS. يظهر تحذير عند 10,000 توكن، والسقف الافتراضي هو 25,000. الخادم الذي يعيد مسارًا قصيرًا أو رابطًا يبقى بعيدًا جدًا عن هذا الحد. أما الخادم الذي يعيد صورًا كبيرة مضمّنة فقد يصل إليه بسرعة.

كابلات إيثرنت زرقاء مرتبة بعناية في لوحة توصيل سوداء

الإعداد في خمس خطوات

  1. ثبّت Claude Code وتأكد من تشغيله بالأمر claude --version.
  2. أنشئ حسابًا لدى مزوّد صور وانسخ بيانات الاعتماد للوصول التي يمنحك إياها.
  3. سجّل الخادم بالأمر claude mcp add.
  4. اختر نطاقًا: محلي، أو مشروع، أو مستخدم.
  5. أكّد الاتصال بالأمر claude mcp list.

تسجيل الخادم

بالنسبة إلى خادم stdio محلي، يكون الشكل كما يلي:

claude mcp add --transport stdio --env <PROVIDER_VARIABLE>=<your-credential> --env IMAGE_OUTPUT_DIR=/absolute/path/to/public/images image-gen -- npx -y mcp-image

كل ما يسبق -- يخص Claude Code. وكل ما يأتي بعده يُمرَّر إلى الخادم دون تغيير. إذا نسيت --، فإن واجهة الأوامر تحاول قراءة أعلام الخادم على أنها أعلامها هي. أما اسم متغير البيئة الدقيق فيأتي من ملف README الخاص بالخادم، لأن كل مزوّد يستخدم اسمًا خاصًا به.

بالنسبة إلى خادم مستضاف، بدّل طريقة النقل إلى http:

claude mcp add --transport http image-gen <server-url> --header "Authorization: Bearer <your-credential>"

⚠️ مستخدمو Windows: على Windows الأصلي، خارج WSL، تحتاج الخوادم التي تُشغَّل باستخدام npx إلى غلاف: claude mcp add --transport stdio image-gen -- cmd /c npx -y mcp-image. بدونه قد يفشل الخادم في البدء.

رجل ملتحٍ يرتدي سترة رمادية يعمل على حاسوب محمول فوق أريكة بجوار نافذة ممطرة

اختيار النطاق

النطاقيُخزَّن فيمن يراهالاستخدام المناسب
local (الافتراضي)~/.claude.json، ضمن مشروعكأنت فقط، مشروع واحدتجربة خادم جديد
project.mcp.json في جذر المستودعكل من ينسخ المستودعأدوات معيارية للفريق
user~/.claude.json، على المستوى الأعلىأنت فقط، في كل المشاريعالأدوات الشخصية

أضف --scope project أو --scope user إلى الأمر. عندما يوجد الاسم نفسه في عدة نطاقات، يتقدم المحلي على المشروع، ويتقدم المشروع على المستخدم.

يناسب نطاق المشروع عمل الصور لأن الفريق كله يحصل على الإعداد نفسه. لكن لا تُضف بيانات الاعتماد إلى المستودع. يدعم .mcp.json توسيع ${VAR} داخل command، وargs، وenv، وurl، وheaders، فيحمل الملف مرجعًا، ويوفّر كل مطوّر القيمة من طرفيته الخاصة:

{
  "mcpServers": {
    "image-gen": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "mcp-image"],
      "env": {
        "IMAGE_OUTPUT_DIR": "${IMAGE_OUTPUT_DIR}",
        "<PROVIDER_VARIABLE>": "${<PROVIDER_VARIABLE>}"
      }
    }
  }
}

يطلب Claude Code الموافقة قبل تشغيل خادم من .mcp.json الخاص بالمشروع، لذلك تظهر في أول جلسة لزميل في الفريق حالة pending approval حتى يوافق عليه.

أربعة زملاء حول طاولة طويلة من خشب البلوط الأبيض يراجعون صورة منتج مطبوعة

التحقق من الاتصال

شغّل claude mcp list. يحصل كل خادم على حالة: Connected، أو Failed to connect، أو Needs authentication، أو Pending approval. يعرض claude mcp get image-gen تفاصيل خادم واحد. داخل الجلسة، يفتح /mcp اللوحة نفسها، ويعيد /mcp reconnect all محاولة أي شيء فشل.

ثم اختبر بطلب صغير: "Generate one 16:9 image of a ceramic mug on a wooden desk and save it to public/images/test.jpg." إذا ظهر استدعاء الأداة باسم mcp__image-gen__generate_image وظهر ملف في المجلد، فالخادم يعمل.

أفضل الخوادم مقارنةً

يأتي الجدول أدناه من قائمة كل مشروع، لذلك راجع ملف README للخيارات الحالية قبل التثبيت. لم أقِس جودة الصور عبر هذه الخوادم، لأن الجودة تعتمد على النموذج الذي يقف خلف الخادم أكثر بكثير من الخادم نفسه.

الخادمالنماذج التي يقف خلفهاالتثبيتالمخرجاتأفضل استخدام
mcp-imageGemini (الافتراضي)، OpenAI، BytePlus Seedreamnpx -y mcp-imageيُحفظ في IMAGE_OUTPUT_DIRخادم واحد، ثلاثة مزوّدين
create-image-mcpOpenAI GPT Imagenpm install -g @gpriday/create-image-mcpيُحفظ على القرص، ويُعاد المسارمستخدمو OpenAI الذين يحتاجون إلى الأقنعة والتعديل الموضعي
خوادم Replicate المجتمعيةنماذج مستضافة على Replicateحزمة Python من PyPIيختلف حسب الخادممجموعة واسعة من النماذج، والمهام الدفعية
خوادم FLUX المجتمعيةنماذج FLUXنص Python محلييختلف حسب الخادمالإعدادات التي تديرها بنفسك
موصل PicassoIAنماذج PicassoIA للصور والفيديوموصل أو عنوان URL من httpروابط النتائج بعد الاستعلامالصور والفيديو في مكان واحد

ثلاث بطاقات فهرسة كريمية في صف على طاولة من الشيست الداكن، وبجانبها قلم حبر

خوادم محلية تشغّلها بنفسك

mcp-image يعرض أداة واحدة باسم generate_image تتولى تحويل النص إلى صورة والتعديل انطلاقًا من صورة مدخلة. يقدّم إعدادات مسبقة سريعة ومتوازنة وعالية الجودة، وتصل نسب العرض إلى 21:9. تضبط بيانات اعتماد واحدة لأي مزوّد تختاره، بالإضافة إلى مجلد مخرجات مطلق.

create-image-mcp يعمل مع OpenAI فقط. أداته create_image تدعم أحجامًا تصل إلى 4K، وإعدادات جودة، والشفافية، وعدة صور بديلة في كل استدعاء، والأقنعة للتعديل الموضعي. يحفظ على القرص ويرد بمسار، وهذا يُبقي تكلفة التوكنات منخفضة.

خوادم Replicate المجتمعية مثل mcp-server-replicate تعرض تحويل النص إلى صورة، وتحويل الصورة إلى صورة، والتعديل عبر أي نموذج تستضيفه Replicate، ويعالج أحدها حتى 5 صور في المرة الواحدة. اختر هذا المسار عندما تريد تبديل النماذج كثيرًا.

الثمن الذي تدفعه مع كل خادم محلي هو الصيانة. تدير إصدارات Node أو Python بنفسك، وتدفع للمزوّد مباشرةً، وتحدّث الحزمة بنفسك.

الخوادم المستضافة والموصلات

يلغي الخادم المستضاف خطوة التثبيت. تضيف عنوان URL وبيانات اعتماد، ويتولى المزوّد الباقي. يعيد Claude Code محاولة الاتصال البعيد المنقطع حتى خمس مرات بتأخيرات متزايدة، فتتعافى الانقطاعات القصيرة دون تدخل منك. التكلفة هي الاعتماد على وقت تشغيل جهة أخرى وقواعد خطتها.

يحمّل Claude Code أيضًا الموصلات من حساب claude.ai الخاص بك عندما تسجل الدخول به. وهي في أدنى ترتيب للأولوية، أسفل الخوادم المحلية والخاصة بالمشروع والمستخدم، وضبط ENABLE_CLAUDEAI_MCP_SERVERS=false يعطّلها.

استخدام PicassoIA من Claude Code

يمنحك PicassoIA توليد الصور والتعديل والفيديو عبر موصل واحد، وهذا يناسب المشاريع التي تحتاج إلى صورة ثابتة ومقطع قصير متناسق معها.

يدا مصوّر تمسكان صورة مطبوعة لوادٍ جبلي فوق طاولة خشبية عليها مطبوعات أخرى

ما يعرضه الموصل

يقدّم موصل PicassoIA تسع أدوات: generate_image، وedit_image، وgenerate_video_picassoia، وgenerate_video_seedance، وget_generation، وlist_generations، وlist_models، وget_account، وcancel_generation.

التوليد غير متزامن. يعيد استدعاء التوليد predict_id فور قبول وحدة GPU للمهمة، ويعرض get_generation الحالة حتى تظهر succeeded أو failed. يشغّل Claude Code حلقة الاستعلام هذه نيابةً عنك بمجرد أن تطلب النتيجة.

تتبع واجهة API الخاصة بالمطوّرين التي تقف خلفها تصميمًا على غرار Replicate. عنوان URL الأساسي هو https://api.picassoia.com/v1، والمصادقة تتم عبر سرّ Bearer يبدأ بالبادئة pia_sk_، والنقطتان الرئيسيتان هما POST /v1/models/{owner}/{name}/predictions وGET /v1/predictions/{id}. خطّط وفق هذه الحدود:

  • 5 تنبؤات متزامنة لكل حساب، مشتركة بين كل المفاتيح السرية واتصالات MCP
  • 4,000 حرف لكل أمر نصي
  • 10 ميغابايت لكل جسم طلب
  • 3 ساعات قبل انتهاء مهلة التنبؤ

💡 تحقق من خطتك أولًا. يعرض PicassoIA وصول API وMCP في صفحة الأسعار، وقد تختلف التفاصيل بين الخطط. تأكد أن خطتك تشمله قبل أن تبني سير عمل عليه.

أي نموذج تختار

النموذجالاستخدام المناسب
PicassoIA Imageعمل تحويل النص إلى صورة اليومي
PicassoIA Image Editor Proالتعديلات والتنقيح على صورة موجودة
PicassoIA Videoمقاطع قصيرة من نص أو صورة ثابتة
Seedance 2.5 Liteفيديو مع صوت، مدرج لمقاطع تصل إلى 10 ثوانٍ

يضم كتالوج PicassoIA الأوسع نماذج صور كثيرة أخرى، منها GPT Image 2، وSeedream 5 Lite، وFlux 2 Pro، وNano Banana 2. جرّب أمرًا نصيًا في التطبيق الويب أولًا، واختر الشكل الذي يعجبك، ثم اطلب من Claude Code إعادة إنتاجه.

أما الجانب النصي من العمل، فيضم الكتالوج نفسه Claude Sonnet 5 وClaude Opus 4.7، وهما مفيدان لصياغة تنويعات من الأوامر النصية قبل لصقها في الجلسة.

إضافة الفيديو إلى الحلقة

غالبًا ما تنتمي الصورة الثابتة والمقطع القصير معًا، مثل صورة رئيسية وبانر متكرر. اطلب من Claude Code توليد الصورة الثابتة باستخدام PicassoIA Image، ثم مرّر النتيجة إلى أداة فيديو كإطار البداية. شغّل فيديو واحدًا في كل مرة، لأن كل مهمة تأخذ حصة من فتحاتك الخمس المتزامنة.

كيفية استخدام PicassoIA Image

  1. تحقق من الوصول. افتح حسابك في PicassoIA وتأكد من وصول API وMCP في خطتك.
  2. اربط. أضف موصل PicassoIA إلى حسابك في claude.ai، أو سجّل خادم http بعنوان URL من صفحة اتصالات MCP في حسابك على picassoia.com/en/mcp/accounts. لا ينشر PicassoIA هذا العنوان في صفحاته العامة، لذلك انسخه من حسابك.
  3. تحقق. شغّل claude mcp list، أو اكتب /mcp داخل الجلسة، وتأكد من ظهور PicassoIA كمتصل.
  4. اعرض النماذج. اطلب: "List the PicassoIA models my account can use." فيستدعي Claude Code list_models.
  5. وَلِّد. اطلب الصورة مع الحجم والوجهة، مثلًا "16:9 hero image of a walnut desk in morning light, save it as public/images/hero.jpg."
  6. نزّل. يستعلم Claude Code عن get_generation، ثم يجلب رابط النتيجة إلى مجلدك ويحدّث الترميز.
  7. حسّن. أرسل الملف المحفوظ إلى edit_image مع PicassoIA Image Editor Pro لتعديلات الدرجات اللونية والتفاصيل.

أوامر نصية تعمل داخل الجلسات

للأوامر النصية الخاصة بالصور داخل Claude Code ميزة واحدة على نموذج الويب: يستطيع الوكيل رؤية ملفك. استفد منها. صف وظيفة الصورة، لا محتواها فقط، واذكر مسار الملف والحجم حتى لا تحتاج إلى جولة ثانية.

امرأة ذات شعر قصير بلون الكستنائي المحمر تكتب في دفتر تحت مصباح مكتب دافئ

طلب ضعيفطلب قوي
"Make a nice header image""16:9 header for the pricing page, a ceramic cup on a walnut desk, window light from the left, no text"
"Add some pictures""Generate 3 images, one per section heading in features.html, and save them in public/images/"
"Fix the image""Edit hero.jpg: warmer tones, remove the cable in the lower left corner"

ثلاث عادات توفّر أكبر قدر من الوقت:

  • اطلب صورة واحدة أولًا. تحقق من الأسلوب، ثم اطلب الباقي في دفعة من خمس صور أو أقل.
  • اطلب النص البديل في الرسالة نفسها. يكتبه Claude Code بينما المشهد ما زال حاضرًا في السياق.
  • احفظ القواعد مرة واحدة. ضعها في ملف CLAUDE.md الخاص بمشروعك حتى تبدأ كل جلسة بالإعدادات الافتراضية نفسها.
## Images
- Generate images with the image-gen server, 16:9 unless the layout says otherwise
- Save to public/images/ with lowercase hyphenated names
- Write one-sentence alt text that describes the scene
- Photographic style, natural light, no text inside the image

💡 نصيحة: حدّد مجلد المخرجات في CLAUDE.md، لا في كل أمر نصي. هذا السطر الواحد يمنع الملفات من الوقوع في جذر المستودع.

إصلاح الأخطاء الشائعة

يدا فنيّ تفتحان حاسوبًا محمولًا فضيًا بمفك دقيق على طاولة عمل رمادية

الخادم يظهر كفاشل

شغّل أمر الخادم يدويًا في طرفية عادية. يظهر فورًا غياب تثبيت Node، أو خطأ مطبعي في اسم الحزمة، أو متغير بيئة غير مضبوط. بعد ذلك، تحقق من أن -- موجود بين خيارات Claude وأمر الخادم. على Windows، أضف الغلاف cmd /c المذكور سابقًا. إذا كان الخادم بطيئًا في البدء فقط، فارفع حد بدء التشغيل، مثلًا MCP_TIMEOUT=10000 claude، وهو مقاس بالميلي ثانية. ثم شغّل /mcp reconnect all.

الصور تتجاوز حد التوكنات

إذا أطلقت نتيجة أداة التحذير عند 10,000 توكن، فالأرجح أن الخادم يعيد بيانات صورة مضمّنة. انتقل إلى خادم يحفظ على القرص أو يعيد رابطًا. رفع السقف باستخدام MAX_MCP_OUTPUT_TOKENS=50000 claude حل أخير، لكنه يستهلك سياقًا تفضّل أن تبقيه للكود.

توليدات بطيئة أو متوقفة

ينقل Claude Code استدعاءات الأدوات التي تستغرق أكثر من دقيقتين إلى مهمة خلفية، ويمكنك متابعتها في /tasks. مع موصل غير متزامن، تكون المهمة البطيئة غالبًا نتيجة طابور ممتلئ. طلب اثنتي عشرة صورة دفعة واحدة على حساب محدود بخمس تنبؤات متزامنة يعني أن سبعًا منها ستنتظر. اطلب خمسًا في المرة، واستخدم cancel_generation لمهمة لم تعد تحتاجها.

أنشئ أول صورة لك اليوم

يستغرق الإعداد نحو عشر دقائق: أمر واحد، واختيار نطاق واحد، وأمر نصي تجريبي واحد. بعد ذلك، يمكن لكل صفحة يبنيها Claude Code أن تُنشر بصورها الخاصة بدلًا من مربعات العناصر النائبة.

حاسوب محمول مفتوح وكوب شاي يتصاعد منه البخار على طاولة خشبية في شرفة عند الغروب

ابدأ بشيء صغير. جرّب أمرًا نصيًا في PicassoIA Image، ثم نقّح نتيجة واحدة باستخدام PicassoIA Image Editor Pro، ثم حوّل المفضلة لديك إلى فيديو باستخدام PicassoIA Video. عندما يصبح الشكل مناسبًا، سلّم الأمر النصي نفسه إلى Claude Code ودعه يشغّل الحلقة داخل مشروعك. تصفح قائمة النماذج الكاملة على picassoia.com/en/all-models وأنشئ صورك الخاصة مع Picasso IA اليوم.

شارك هذا المقال

اختر لغتك

مقالات ذات صلة