كيفية استخدام خادم MCP للتحكم في متصفح كروم (مع Browserbase MCP Server)

هل تمنيت يومًا أن يتمكن ذكاؤك الاصطناعي من تصفح الويب مثلك تمامًا؟ حسنًا، استعد جيدًا لأننا اليوم سنغوص في عالم **خادم Browserbase MCP**—أداة ثورية تتيح لنماذج الذكاء الاصطناعي مثل كلود وGPT وجميني التحكم في متصفحات الويب. تخيل أن ذكاءك الاصطناعي يتنقل في المواقع الإلكترونية، وينقر على الأزرار، ويملأ النماذج، بل ويلتقط لقطات شاشة، كل ذلك بمفرده. هل يبدو الأمر مستقبليًا؟ إنه يحدث الآن، وإعداده أسهل مما تتخيل، خاصة مع **خادم Browserbase MCP**.

في هذا الدليل، سأشرح لك ما هو **خادم Browserbase MCP**، ولماذا هو ضروري لسير العمل المدعوم بالذكاء الاصطناعي، وكيفية إعداده وتشغيله للتحكم في متصفح كروم. سواء كنت مطورًا، أو عالم بيانات، أو مجرد شخص فضولي تجاه الذكاء الاصطناعي، فإن هذا البرنامج التعليمي خطوة بخطوة سيجعلك تشعر وكأنك محترف. لنبدأ!

💡

هل تريد أداة رائعة لاختبار واجهات برمجة التطبيقات (API) تُنشئ توثيقًا جميلًا لواجهة برمجة التطبيقات؟

هل تريد منصة متكاملة وشاملة لفريق المطورين لديك للعمل معًا بأقصى إنتاجية؟

يلبي Apidog جميع متطلباتك، ويحل محل Postman بسعر أكثر تنافسية بكثير!

زر

ما هو خادم Browserbase MCP؟

**خادم Browserbase MCP** هو أداة مفتوحة المصدر تستخدم بروتوكول سياق النموذج (MCP) لربط نماذج اللغة الكبيرة (LLMs) بمتصفحات الويب. فكر فيه كجسر يسمح للذكاء الاصطناعي بالتفاعل مع المواقع الإلكترونية في الوقت الفعلي. باستخدام هذا الخادم، يمكن لذكائك الاصطناعي:

التنقل إلى أي عنوان URL
النقر على الأزرار وملء النماذج
استخراج البيانات من صفحات الويب
التقاط لقطات شاشة
تشغيل JavaScript على المواقع الإلكترونية
التعامل مع جلسات متصفح متعددة في وقت واحد

إنه مثل منح ذكائك الاصطناعي يديه الخاصتين لتصفح الويب. وأفضل جزء؟ إنه يعمل مع نماذج الذكاء الاصطناعي الشائعة مثل GPT من OpenAI، وكلود من Anthropic، وجميني من Google.

لماذا تستخدم خادم Browserbase MCP؟

قبل أن ننتقل إلى كيفية الاستخدام، دعنا نتحدث عن سبب كون **خادم Browserbase MCP** أداة تغيير قواعد اللعبة:

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

سواء كنت تقوم ببناء تطبيق مدعوم بالذكاء الاصطناعي، أو أتمتة سير العمل، أو مجرد التجربة، فإن **خادم Browserbase MCP** يوفر الوقت ويفتح إمكانيات جديدة.

كيفية تثبيت وإعداد خادم Browserbase MCP

هناك ثلاث طرق للبدء: استخدام خادم بعيد مستضاف، أو التشغيل باستخدام npm، أو تشغيله محليًا. سأغطي الطرق الثلاث حتى تتمكن من اختيار الأنسب لك.

المتطلبات الأساسية

قبل أن تبدأ في استخدام **خادم Browserbase MCP** للتحكم في متصفح كروم بالذكاء الاصطناعي، تأكد من توفر ما يلي:

عميل ذكاء اصطناعي متوافق مع MCP: قم بتثبيت عميل مثل Claude Desktop أو Cursor يدعم بروتوكول سياق النموذج (MCP).
مفتاح API لـ Browserbase: احصل عليه من Browserbase لربط ذكائك الاصطناعي بأتمتة المتصفح.

للإعداد المحلي (اختياري)

إذا كنت تخطط لتشغيل الخادم محليًا، فستحتاج أيضًا إلى:

Git: لاستنساخ المستودع من GitHub.
pnpm: قم بتثبيت مدير الحزم هذا من pnpm.io للتعامل مع التبعيات.
Node.js: قم بتنزيله من nodejs.org لتشغيل الخادم.
مفتاح API لنموذج الذكاء الاصطناعي: احصل على واحد للنموذج الذي اخترته، على سبيل المثال، Gemini.

الخيار 1: استخدام خادم BrowserBase MCP البعيد المستضاف (الأسهل)

إذا كنت ترغب في تخطي عناء الإعداد، فالخيار المستضاف هو صديقك. إليك الطريقة:

قم بزيارة Smithery: توجه إلى smithery.ai للحصول على مفاتيح API وعنوان URL لـ MCP عن بُعد.

تهيئة عميل الذكاء الاصطناعي الخاص بك: أضف عنوان URL المقدم إلى إعدادات MCP لعميل الذكاء الاصطناعي الخاص بك. على سبيل المثال، في Claude Desktop، ستضيف هذا إلى ملف claude_desktop_config.json الخاص بك:

{
  "mcpServers": {
    "browserbase": {
      "url": "https://your-smithery-url.com"
    }
  }
}

أو، إذا كنت تستخدم واجهة سطر الأوامر mcp-remote:

{
  "mcpServers": {
    "browserbase": {
      "command": "npx",
      "args": ["mcp-remote", "https://your-smithery-url.com"]
    }
  }
}

أعد تشغيل عميلك: أغلق عميل الذكاء الاصطناعي الخاص بك وأعد فتحه لتطبيق التغييرات.

هذا كل شيء! يمكن لذكائك الاصطناعي الآن التحكم في متصفح كروم من خلال **خادم Browserbase MCP**.

الخيار 2: تشغيل خادم BrowserBase MCP على NPM (موصى به)

هذا هو النهج الموصى به نظرًا لتوافقه مع معظم عملاء MCP. انتقل إلى ملف MCP Config JSON الخاص بك والصق تهيئة خادم Browserbase:

{
  "mcpServers": {
    "browserbase": {
      "command": "npx",
      "args": ["@browserbasehq/mcp"],
      "env": {
        "BROWSERBASE_API_KEY": "",
        "BROWSERBASE_PROJECT_ID": "",
        "GEMINI_API_KEY": ""
      }
    }
  }
}

الخيار 3: تثبيت وتشغيل خادم BrowserBase MCP محليًا (لتحكم كامل)

هل تريد التعديل تحت الغطاء؟ تشغيل الخادم محليًا يمنحك المزيد من المرونة. إليك الطريقة:

استنساخ المستودع:

افتح طرفيتك وقم بتشغيل:

git clone https://github.com/browserbase/mcp-server-browserbase.git
cd mcp-server-browserbase

تثبيت التبعيات:

تأكد من تثبيت pnpm. ثم قم بتشغيل:

pnpm install && pnpm build

بدء تشغيل الخادم:

يمكنك تشغيل الخادم باستخدام STDIO أو نقل HTTP.
لـ STDIO (عملية محلية):
أضف هذا إلى تهيئة عميل MCP الخاص بك:

{
  "mcpServers": {
    "browserbase": {
      "command": "node",
      "args": ["path/to/mcp-server-browserbase/cli.js"],
      "env": {
        "BROWSERBASE_API_KEY": "your_api_key",
        "BROWSERBASE_PROJECT_ID": "your_project_id",
        "GEMINI_API_KEY": "your_gemini_key"
      }
    }
  }
}

لنقل HTTP:
ابدأ تشغيل الخادم بـ:

node cli.js --port 3000

قم بتهيئة عميلك للاتصال بـ http://localhost:3000.

أضف مفاتيح API: استبدل العناصر النائبة في التهيئة بمفاتيح API الفعلية لـ Browserbase والنموذج الخاص بك.

أعد تشغيل عميلك: تمامًا كما في السابق، أعد تشغيل عميل الذكاء الاصطناعي الخاص بك لتمكين الخادم.

تخصيص الخادم

يوفر **خادم Browserbase MCP** علامات لتعديل سلوكه. إليك بعض العلامات المفيدة:

--proxies: تمكين وكلاء Browserbase لخصوصية أفضل.
--advancedStealth: استخدام وضع التخفي لتجنب الكشف (يتطلب خطة Scale).
--browserWidth و --browserHeight: تعيين حجم نافذة المتصفح.
--modelName: اختيار نموذج ذكاء اصطناعي مختلف لـ Stagehand.

يمكنك إضافة هذه العلامات إلى مصفوفة args في تهيئة MCP الخاصة بك. على سبيل المثال:

"args": ["path/to/cli.js", "--proxies", "--browserWidth=1920"]

كيفية استخدام خادم Browserbase MCP للتحكم في كروم

الآن بعد أن تم إعداد خادمك، دعنا نضعه في العمل! إليك كيفية استخدام **خادم Browserbase MCP** للتحكم في متصفح كروم.

الخطوة 1: ربط عميل الذكاء الاصطناعي الخاص بك

تأكد من أن عميل الذكاء الاصطناعي الخاص بك (مثل Claude Desktop أو Cursor) متصل بـ **خادم Browserbase MCP** باستخدام إحدى الطرق الثلاث المذكورة أعلاه.

الخطوة 2: إعطاء الأوامر

في عميل الذكاء الاصطناعي الخاص بك، يمكنك الآن إصدار أوامر باللغة الطبيعية للتحكم في المتصفح. إليك بعض الأمثلة:

التنقل إلى عنوان URL:

https://example.com

انقر على زر:

"انقر على زر 'التسجيل'"

املأ نموذجًا:

user@example.com

التقط لقطة شاشة:

"التقط لقطة شاشة للصفحة الرئيسية"

استخراج البيانات:

"استخرج جميع عناوين المنتجات من هذه الصفحة"

سيقوم الذكاء الاصطناعي بترجمة هذه الأوامر إلى إجراءات متصفح باستخدام **خادم Browserbase MCP**.

الخطوة 3: عرض النتائج

اعتمادًا على الأمر، سيعرض الذكاء الاصطناعي نتائج مثل:

تأكيد الإجراءات (على سبيل المثال، "تم التنقل إلى https://example.com")
البيانات المستخرجة (على سبيل المثال، قائمة بعناوين المنتجات)
لقطات الشاشة (محفوظة أو معروضة، حسب إعداداتك)

على سبيل المثال، إذا طلبت لقطة شاشة، فقد يرد الذكاء الاصطناعي بـ:

"تم التقاط لقطة الشاشة وحفظها باسم 'homepage.png'"

اختبار خادم Browserbase MCP

دعنا نختبره بمثال واقعي. لنفترض أنك تريد أتمتة عملية بحث على موقع ويب.

افتح عميل الذكاء الاصطناعي الخاص بك: لهذا المثال، دعنا نستخدم Claude Desktop.
أصدر أمرًا:

https://google.com

3. راقب المتصفح: إذا كنت تقوم بالتشغيل محليًا باستخدام نقل HTTP، فقد ترى المتصفح يفتح ويقوم بالإجراءات.

4. تحقق من الاستجابة: يجب أن يؤكد كلود الإجراءات وربما يستخرج عنوان الصفحة أو محتواها.

يوضح هذا الاختبار البسيط كيف يتيح **خادم Browserbase MCP** للذكاء الاصطناعي التحكم في كروم لأداء مهام الويب.

نصائح استكشاف الأخطاء وإصلاحها

الخادم لا يبدأ؟ تأكد من أن لديك مفاتيح API الصحيحة وأن pnpm build اكتمل بنجاح.
العميل لا يتصل؟ تحقق مرة أخرى من تهيئة MCP وأعد تشغيل عميل الذكاء الاصطناعي الخاص بك.
الإجراءات لا تعمل؟ تحقق من بنية الموقع؛ قد تتطلب بعض المواقع وضع تخفي متقدم أو وكلاء.
مشاكل في النموذج؟ تأكد من أن مفتاح API للنموذج الخاص بك صالح وأن النموذج يدعم الإمكانيات المطلوبة.

الخاتمة

وهكذا! لقد تعلمت كيفية استخدام **خادم Browserbase MCP** للتحكم في متصفح كروم باستخدام الذكاء الاصطناعي. سواء اخترت المسار المستضاف للبساطة، أو npm، أو الإعداد المحلي للتحكم، فأنت الآن مجهز لأتمتة مهام الويب كالمحترفين. **خادم Browserbase MCP** هو أداة قوية تجمع بين الذكاء الاصطناعي وأتمتة الويب، مما يفتح إمكانيات لا حصر لها للابتكار.

هل أنت مستعد لاستكشاف المزيد؟ حاول أتمتة مهام الويب اليومية أو دمجها في مشروعك القادم للذكاء الاصطناعي.

💡

زر