إنشاء الصور في Cursor: دليل إعداد خادم MCP

إن خادم MCP لـ Cursor عبارة عن صندوق أدوات خارجي يمكن لمساعد المحرر استدعاؤه من الدردشة: ما عليك سوى إضافة كتلة JSON واحدة إلى mcp.json، ليكتسب Cursor قدرات لا تمتلكها نماذجه الأساسية، بما في ذلك إنشاء الصور. يقوم مساعد Cursor بتحرير الملفات وتشغيل أوامر الطرفية طوال اليوم، ولكن لا يمكن لأي من النماذج التي تقف خلفه إنتاج ملف صورة. قم بتوصيل خادم إنشاء الصور، وستصبح عبارة "اصنع لي صورة hero بنسبة 16:9 لصفحة الهبوط هذه" بمثابة توجيه دردشة عادي ينتهي بملف حقيقي في مستودع الكود الخاص بك.

إليك الإعداد الكامل، إذا كان هذا كل ما تبحث عنه. أنشئ مفتاح API في ملفك الشخصي على BananaBanana، ثم أضف هذا إلى ~/.cursor/mcp.json (عام) أو .cursor/mcp.json في المشروع:

{
  "mcpServers": {
    "bananabanana": {
      "url": "https://bananabanana.pro/api/mcp",
      "headers": {
        "Authorization": "Bearer ${env:BB_API_KEY}"
      }
    }
  }
}

قم بتصدير BB_API_KEY=bb_live_YOUR_KEY في بيئتك البرمجية وقد انتهيت. لا توجد عملية خادم محلي، ولا حساب على Google Cloud، ولا اشتراكات. يتم احتساب تكلفة الصور بدءًا من $0.03 من رصيد مدفوع مسبقًا، والفيديو بدءًا من $0.10. تم إنشاء كلتا الصورتين التجريبيتين في هذا الدليل من خلال هذا الإعداد الدقيق تمامًا باستخدام مفتاح نشط أثناء كتابتي للنص؛ وتفاصيل التتبع وفاتورة الوسائط البالغة $0.55 موضحان أدناه.

لماذا تقوم بربط مولد صور بـ Cursor؟

لأن عمل الواجهة الأمامية (frontend) يستمر في طلب الصور في اللحظة التي تندمج فيها يداك في الكود تمامًا. صورة hero لصفحة الهبوط، أو عناصر نائبة لبطاقات المنتجات حتى لا تظهر الشبكة بمربعات رمادية، أو صورة OG لمقال المدونة الذي قمت بربطه للتو. ليس أي من هذه الأمور صعبًا، ولكن كل منها كان يعني نفس الرحلة الطويلة المعتادة: افتح مولد صور في علامة تبويب المتصفح، واكتب برومبت، ثم قم بالتنزيل، وأعد التسمية، واسحب إلى مجلد public/، ثم ارجع، واكتب علامة <img>. عشر دقائق من العمل الروتيني الممل لكل أصل، وستفقد تركيزك ومكانك في المكون البرمجي.

مع وجود خادم MCP، يدير مساعد الذكاء الاصطناعي هذه الدورة بأكملها. يكتب البرومبت (عادةً أفضل من مسودتي الأولى الكسولة)، ويستدعي generate_image، ويقوم بتنزيل النتيجة في المجلد الصحيح، ويكتب كود الوسم مع نص alt البديل. كل ما عليك فعله هو مراجعة الفروق (diff) بدلاً من القيام بالأعمال الروتينية.

الجانب الآخر المثير للاهتمام هو ما لا تحتاج إلى تثبيته. توجد خوادم MCP محلية لإنشاء الصور وتعمل بالفعل، ولكنها تتطلب تشغيل عمليات Node أو Python الخاصة بك وجلب مفتاح Google API الخاص بك، مع وجود حصص استخدام وفواتير على حساب Google الخاص بك. بينما يتجاوز الخادم البعيد كل هذا تمامًا: نقطة النهاية (endpoint) تعمل بالفعل من جانبنا، على نفس مسار تدفق البيانات الخاص بـ BananaBanana generator، وبيانات اعتمادك الوحيدة هي مفتاح bb_live_ واحد فقط.

كيف تضيف خادم MCP إلى Cursor؟

ثلاث خطوات، في دقيقتين تقريبًا. تم التحقق من تفاصيل الإعداد الموضحة أدناه ومقارنتها مع وثائق Cursor MCP الرسمية اعتبارًا من 11 يوليو 2026.

أولاً، سجل حسابًا وافتح الملف الشخصي (Profile) ← مفاتيح MCP API. قم بإنشاء مفتاح. سيظهر لك مرة واحدة فقط، ويبدأ بـ bb_live_، ويتم تخزينه مشفرًا من جانبنا، لذا انسخه على الفور. تبدأ الحسابات الجديدة برصيد قدره $0.20، وهو ما يكفي لإنشاء ست صور تجريبية على النموذج الأقل تكلفة.

ثانيًا، اختر مكان وجود ملف الإعداد. يقرأ Cursor من موقعين:

• ~/.cursor/mcp.json — عام (global)، حيث يتبعك الخادم في كل مشروع؛
• .cursor/mcp.json في مجلد جذر المستودع — مخصص للمشروع (project-scoped)، وآمن للنشر (commit) بشرط ألا تضع المفتاح بداخله.

هذا الشرط هو بالضبط ما تحله عملية إدخال المتغير ${env:BB_API_KEY} في الجزء البرمجي أعلاه: يقوم Cursor باستبدال المتغيرات البيئية بالقيم في mcp.json عند التحميل، بحيث لا يحتوي الملف نفسه على أي أسرار. وتدعم نفس الصيغة أيضًا ${workspaceFolder} وبعض المتغيرات الأخرى، وفقًا للوثائق الرسمية.

ثالثًا، أعد تشغيل أو تحديث Cursor وافتح إعدادات Cursor Settings ← MCP. يجب أن يظهر الخادم بمؤشر أخضر وقائمة تضم سبع أدوات، من list_models إلى list_generations. تحتوي صفحة خادم MCP الخاصة بنا على نفس الجزء البرمجي بالإضافة إلى جدول توافق لكل عميل آخر قمنا بالتحقق منه:

إذا لم يظهر الخادم، فانتقل إلى قسم التفاصيل غير المتوقعة (quirks). عادةً ما يكون السبب هو المتغير البيئي، وليس الإعداد نفسه.

حالة استخدام: صورة hero لصفحة الهبوط ولقطات للمنتج دون مغادرة الدردشة

السيناريو الذي بنيت عليه هذه المقالة: أنت مطور واجهة أمامية تقوم بتصميم صفحة هبوط لعلامة تجارية لمعدات التخييم والأنشطة الخارجية، ويتطلب التصميم صورة hero بعرض كامل لخيمة تخييم في وقت الفجر. في دردشة Cursor، تطلب ذلك، ليقوم المساعد بصياغة برومبت بأسلوب فوتوغرافي محترف ويستدعي الأداة. هذا هو التتبع الفعلي من جلستي، مع معرف المهمة (job id) الحقيقي وكل شيء:

→ generate_image {"prompt": "A photorealistic wide hero shot for an outdoor
   gear brand landing page: a lone orange tent glowing softly on the shore of
   a still alpine lake at dawn, mist over the water, sharp granite peaks
   catching the first pink light, generous empty sky for headline text, low
   angle, 35mm lens, no text", "model": "nano-banana-pro", "aspect_ratio": "16:9"}
← {"job_id": "cmrgox3xj000s…", "status": "processing",
   "cost_charged_usd": 0.11, "balance_remaining_usd": 1554.40}
→ get_result {"job_id": "cmrgox3xj000s…"}
← {"status": "completed", "files": [{"url": "https://bananabanana.pro/api/files/…"}]}

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

يقوم المساعد بعد ذلك بسحب الملف من رابط URL الموقع والمؤمن إلى مجلد public/ ويكتب المكون البرمجي. تظل الروابط صالحة لمدة 24 ساعة؛ ويقوم استدعاء جديد للأداة get_result بإعادة إصدارها بعد ذلك.

العناصر النائبة للمنتجات هي نفس الخطوة مع توجيه أكثر تربيعًا. بالنسبة لشبكة البطاقات، طلبت لقطة لزجاجة ماء بالطريقة التي توجه بها مصورًا محترفًا: الموضوع، السطح، الإضاءة، والعدسة. استدعاء واحد، بتكلفة $0.11، وعشرين ثانية فقط:

تم تشغيل كلا العرضين التوضيحيين على نموذج Nano Banana Pro لأنهما يظهران على هذه الصفحة. بالنسبة لملء الشبكات المؤقت، سأستخدم بصراحة نموذج nano-banana-2-lite بتكلفة $0.03 وأقوم بالترقية فقط للصور التي تجتاز مراجعة التصميم؛ يغطي دليل Lite الخاص بنا الحالات التي يكون فيها النموذج الرخيص كافيًا. وإذا كنت بحاجة إلى نفس الشخصية عبر سلسلة من الصور، فإن تقنية كتابة البرومبت تهم أكثر من العميل المستخدم، لذا راجع الدليل الميداني لاتساق الشخصية في توليد الصور.

يعمل الفيديو أيضًا من نفس الدردشة. لا تفرض أداة generate_video رسومًا أبدًا في الاستدعاء الأول: فهي تعرض تسعيرة تقديرية، ويجب على المساعد تكرار الاستدعاء مع استخدام confirm_cost للموافقة على المبلغ المحدد. يبدأ مقطع فيديو صامت بدقة 720p باستخدام نموذج Veo 3.1 Lite بسعر $0.10؛ بينما يبلغ سعر نموذج Omni Flash المصحوب بالصوت $0.10 في الثانية، أي $0.30 للقطة مدتها ثلاث ثوانٍ.

تفاصيل وتحديات خاصة بـ Cursor يجدر بك معرفتها قبل البدء

1. لا يعمل ${env:…} إلا إذا كان بإمكان Cursor رؤية المتغير. يكون التصدير في ملف .zshrc الخاص بك مرئيًا عند تشغيل Cursor من خلال الطرفية، ولكن تطبيق واجهة المستخدم الرسومية (GUI) الذي يتم تشغيله من الـ Dock أو مشغل سطح المكتب لا يقرأ ملف تعريف الشيل (shell profile) الخاص بك، لذا يفشل نفس الإعداد بصمت هناك. حسب خبرتي، هذا هو السبب الأول لعدم اتصال الخادم على نظام التشغيل macOS. الحلول: قم بتعيين المتغير على مستوى نظام التشغيل (launchctl setenv على نظام macOS، أو متغيرات بيئة النظام على Windows)، أو قم بتشغيل Cursor من الطرفية لمرة واحدة للتحقق من أن الإعداد سليم وخالٍ من المشاكل الأخرى.

2. إعداد المشروع ميزة مخصصة لفرق العمل، مفتاح واحد لكل شخص. عند نشر .cursor/mcp.json مع العنصر النائب ${env:BB_API_KEY}، يحصل كل زميل في الفريق على الخادم بمجرد سحب الكود (clone)، وكل منهم باستخدام مفتاحه الخاص. هذا الفصل مهم للغاية: المفاتيح مجانية، ويحصل كل منها على سجل الاستخدام الخاص به (الأداة، النموذج، التكلفة، ومعاينة البرومبت) وحد يومي اختياري بالدولار في الملف الشخصي (Profile) ← مفاتيح MCP API. عندما يغادر شخص ما الفريق، يمكنك ببساطة إلغاء مفتاحه الخاص دون أن يتأثر أي شخص آخر. يمكن لخطط أعمال Cursor المدفوعة أيضًا دفع خوادم MCP عبر لوحة تحكم الفريق، ولكن الملف المنشور يعمل على أي خطة.

3. يطلب Cursor الإذن قبل كل استدعاء للأداة، ومن الأفضل أن تترك هذا الخيار مفعلاً. بشكل افتراضي، ينتظر كل استدعاء لـ MCP موافقتك، وتكون المعاملات (arguments) مرئية تحت سهم صغير بجوار اسم الأداة. في أوضاع التشغيل التلقائي، يتم تنفيذ الأدوات المدرجة في القائمة البيضاء على الفور. قد يكون النقر فوق الموافقة عشرين مرة أثناء تشغيل دفعة واحدة أمرًا مملًا، أنا أعلم ذلك، ولكن بالنسبة للأدوات التي تستهلك أموالًا حقيقية لكل استدعاء، يفضل الاحتفاظ بخيار الموافقة مفعلاً والسماح فقط للأدوات المجانية (list_models، get_result) بالعمل التلقائي. يحتوي الفيديو على حزام أمان ثانٍ من جانبنا في جميع الأحوال: لن يتم فرض أي رسوم أعلى من التسعيرة التقديرية بدون تأكيد التكلفة عبر confirm_cost.

4. يمكنك رؤية الصورة المنشأة داخل الدردشة مباشرة. وفقًا لوثائق Cursor، يتم إرفاق الصور التي ترجعها أدوات MCP بالحادثة أو المحادثة، ويمكن للنماذج التي تدعم الرؤية تحليلها. يتضمن استدعاء get_result الخاص بنا معاينة صغيرة بصيغة webp بجانب الرابط، حتى يتمكن المساعد الذكي (وأنت أيضًا) من تقييم النتيجة دون الحصول على حاجة لفتح المتصفح. ويعني هذا أيضًا أن المساعد قادر على تصحيح نفسه ذاتيًا: اطلب منه فحص الصورة وإعادة توليدها إذا استقرت الخيمة مثلاً في منتصف مساحة العنوان الرئيسي المخصصة للنصوص.

5. توجد روابط تثبيت بنقرة واحدة، ولكن لا تضع مفاتيحك فيها. يدعم Cursor روابط cursor:// العميقة (deeplinks) التي تقوم بتثبيت خادم MCP من إعداد مشفر بصيغة base64، وفقًا لـ وثائق روابط التثبيت. هذا مفيد للخوادم المفتوحة والعامة، ولكنه غير مناسب للخوادم التي تطلب مصادقة، لأن الإعداد المرمز سيحمل مفتاحك الفعلي، وأي شخص يحصل على الرابط سيتمكن من استخدام رصيدك. لهذا السبب فإن الزر الموجود على موقعنا عبارة عن جزء برمي للنسخ واللصق مع عنصر نائب للمتغير البيئي بدلاً من رابط تثبيت مباشر لـ Cursor. قم باللصق، وتصدير المتغير، وانتهى الأمر.

هناك قيد حقيقي واحد من جانب المنتج يجدر بنا ذكره بكل صراحة: أداة MCP المسماة generate_image لا تقبل الصور كمدخلات حتى الآن، لذا فإن التوليد القائم على الصور المرجعية وتحويل الصور إلى فيديو لا يزال يتطلب استخدام مولد الويب. بينما يعمل توليد الصور من النصوص، وتحسين الصور عبر عدة جولات باستخدام edit_image وتحويل النصوص إلى فيديو بشكل ممتاز عبر MCP اليوم.

كم بلغت تكلفة الوسائط التجريبية في هذه المقالة؟

الأسعار القياسية لكل عملية إنشاء، وهي نفس الأرقام التي تبلغ بها أداة list_models المساعد الذكي، دون أي خصومات خاصة بالموظفين:

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

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

الأسئلة الشائعة

هل يدعم Cursor خوادم MCP البعيدة التي تستخدم ترويسة تفويض (Authorization header)؟

نعم، بشكل أصلي ومدمج. نظرًا لأن Cursor أضاف بروتوكول Streamable HTTP للتحويل، فإن الخادم البعيد هو مجرد عنوان url بالإضافة إلى كائن headers اختياري في mcp.json، دون الحاجة إلى عملية جسر محلي (local bridge)، كما أن إدخال المتغير عبر ${env:VAR} يحافظ على سرية المفتاح خارج الملف. هذا هو الإعداد الذي يستخدمه هذا الدليل، وتم التحقق منه مقابل وثائق Cursor MCP الرسمية في 11 يوليو 2026. يدعم Cursor أيضًا بروتوكول OAuth للخوادم البعيدة؛ حيث تقوم نقطة النهاية الخاصة بنا حاليًا بالمصادقة باستخدام مفاتيح Bearer، مع التخطيط لإضافة خيار دعم OAuth 2.1 كخيار ثانٍ.

هل أحتاج إلى مفتاح Google API لإنشاء الصور في Cursor؟

لا. تستدعي خوادم MCP المحلية لإنشاء الصور واجهة برمجة تطبيقات Gemini مباشرةً، لذا فهي تتطلب مفتاح Google الخاص بك مع حصص الاستخدام والفوترة المحددة لحسابك. مع الخادم البعيد، يتم تشغيل عملية التوليد على مجموعة مدارة من مفاتيح Vertex AI بواسطة BananaBanana، وتكون وثيقة اعتمادك الوحيدة هي مفتاح bb_live_ من ملفك الشخصي. أنت تستبدل الوصول المباشر إلى واجهة تطبيقات Google الخام بأسعار معقولة تدفعها مقابل كل عملية توليد دون حد أدنى للإنفاق، ورصيد واحد مدفوع مسبقًا، ومفتاح يمكنك إلغاؤه بنقرة واحدة.

هل يجب أن يكون إعداد MCP عامًا أم لكل مشروع على حدة؟

كلاهما يعمل؛ والفرق يكمن في النطاق والمشاركة. يتبعك ملف ~/.cursor/mcp.json في كل مستودع كود، وهو ما يناسب الإعداد الشخصي. بينما ينتقل ملف .cursor/mcp.json في مجلد جذر المشروع مع المستودع، بحيث يحصل الفريق بأكمله على الخادم بعد عملية النسخ (clone)؛ احتفظ بالمفتاح كمرجع متغير بيئي عبر ${env:…} ليصبح الملف آمنًا تمامًا للنشر. خياري الافتراضي هو الإعداد على مستوى المشروع لأي عمل يلمسه الفريق، لأن الإعداد المنشور مع توفير مفاتيح مخصصة لكل مطور يمنحك سجلات استخدام وإمكانية إلغاء الوصول لكل شخص بمفرده.

هل يمكن لـ Cursor توليد الفيديو عبر نفس الخادم؟

نعم، مع وجود خطوة لتأكيد التكلفة. تعرض أداة generate_video دائمًا تسعيرة تقديرية أولاً، ويجب على المساعد تكرار الاستدعاء مع استخدام confirm_cost لمطابقة المبلغ المحدد بدقة قبل فرض أي رسوم. تبدأ الأسعار من $0.10 لمقطع صامت مدته 4 ثوانٍ بدقة 720p باستخدام نموذج Veo 3.1 Lite، وتصل إلى $4.40 لتوليد مقطع عالي الجودة باستخدام نموذج Veo 3.1 مصحوبًا بالصوت، ويبلغ سعر نموذج Omni Flash المصحوب بالصوت $0.10 في الثانية ($0.30–$0.10 في الثانية، أي $0.30 للقطة مدتها ثلاث ثوانٍ للمقطع الواحد). تستغرق المقاطع من دقيقة إلى عشر دقائق، لذا يستمر المساعد في الاستعلام بشكل دوري عبر get_result بينما يواصل العمل على الكود الخاص بك.

لماذا لا يظهر الخادم الخاص بي في Cursor بعد تعديل ملف mcp.json؟

هناك ثلاثة أسباب شائعة، مرتبة حسب احتمالية حدوثها. أولاً، المتغير البيئي ليس مرئيًا لعملية Cursor: التطبيقات التي يتم تشغيلها عبر الواجهة الرسومية لا تقرأ ملف تعريف الشيل (shell profile) الخاص بك، لذا قم بتعيين المتغير على مستوى نظام التشغيل أو ابدأ تشغيل Cursor من الطرفية. ثانياً، لم يتم تحديث الإعداد: أعد تشغيل Cursor بالكامل أو استخدم خيار التحديث في إعدادات MCP. ثالثًا، قد يكون تنسيق JSON غير صالح بشكل طفيف، والفاصلة الزائدة في نهاية الأسطر هي الخطأ الكلاسيكي المعتاد. إذا ظهر الخادم ولكن فشلت استدعاءات الأدوات مع رمز الخطأ 401، فإن المفتاح نفسه غير صحيح أو تم إلغاؤه؛ يمكنك اختباره عبر إرسال طلب خام باستخدام الجزء البرمجي الموضح في صفحة خادم MCP.