يتم تشغيل معظم أتمتة المتصفح من الخارج. الكاتب المسرحي، ومحرك الدمى، والسيلينيوم، والمتصفح، جميعهم يقودون المتصفح من عملية خارجية. يقرأون الصفحة من خلال لقطات الشاشة أو بروتوكول Chrome DevTools.
علي بابا وكيل الصفحة يأخذ الطريق المعاكس. يعيش الوكيل داخل صفحة الويب كجافا سكريبت عادي. يقرأ DOM المباشر كنص ويعمل كمستخدم حقيقي. لا يوجد متصفح بدون رأس، ولا لقطات شاشة، ولا يوجد نموذج متعدد الوسائط.
المشروع مفتوح المصدر بموجب ترخيص MIT. قاعدة التعليمات البرمجية هي TypeScript أولاً. إنه يعتمد على استخدام المتصفح، والذي منه يتم اشتقاق معالجة DOM والموجه.
ليرة تركية؛ د
- يعمل وكيل الصفحة داخل الصفحة كجافا سكريبت، ويقرأ DOM المباشر كنص، وليس لقطات شاشة.
- يؤدي تجفيف DOM إلى ضغط الصفحة إلى ملف
FlatDomTreeبحيث يمكن للنماذج النصية الأصغر حجمًا أن تعمل بدقة. - إنه حيادي النموذج من خلال أي نقطة نهاية متوافقة مع OpenAI ويتم شحنه بموجب ترخيص MIT.
- تعد السلامة على المستوى الفوري ونطاق الصفحة الواحدة حدودًا حقيقية؛ احتفظ بالتحقق من جانب الخادم للإجراءات المحفوفة بالمخاطر.
- الأنسب: مساعدو الطيارين وملء النماذج داخل التطبيقات التي تمتلكها، وليس المواقع الخارجية أو المواقع المغلقة.
ما هو وكيل الصفحة؟
وكيل الصفحة عبارة عن مكتبة من جانب العميل لإضافة سلوك الوكيل إلى تطبيق الويب. يمكنك تضمينه، ثم إصدار الأوامر باللغة الطبيعية. يقوم الوكيل بالبحث عن العناصر والنقر على الأزرار وملء النماذج من داخل الصفحة.
نظرًا لأنه يعمل في جلسة المتصفح، فإنه يرث ملفات تعريف الارتباط والجلسة والمصادقة الخاصة بالمستخدم. ليس هناك خلفية منفصلة للكتابة. تظل قواعد التحقق من صحة واجهة المستخدم والأمان الحالية سارية.
التصميم ملحد للنموذج. يمكنك إحضار نموذج اللغة الكبير الخاص بك من خلال أي نقطة نهاية متوافقة مع OpenAI. يتم إرسال النص فقط إلى النموذج، لذلك يكفي وجود نموذج نصي قوي.
كيف يعمل الجفاف DOM
التقنية الأساسية هي ما يسميه الفريق الجفاف DOM. يمكن للصفحة الحديثة أن تحتوي على آلاف العقد. سيكون إرسال HTML الخام إلى النموذج بطيئًا ومكلفًا.
عند وصول أمر، يقوم الوكيل بفحص نموذج كائن المستند. فهو يحدد كل عنصر تفاعلي، مثل الأزرار والروابط وحقول الإدخال. يتلقى كل عنصر فهرسًا بالإضافة إلى دور وتسمية.
يتم تحويل DOM المباشر إلى ملف FlatDomTree، خريطة نصية واضحة لما يهم. يتم تجريد العلامات الزائدة. يقرأ النموذج هذا التمثيل المضغوط، وليس البكسل.
يعكس العرض التوضيحي التفاعلي الموجود على هذه الصفحة هذه الحلقة. شاهد تحديث لوحات “DOM المجففة” و”تتبع الإجراء” أثناء تشغيل الأوامر.
تحت الغطاء، يعمل مندوبو الوكيل على أ PageController:
await this.pageController.updateTree()
await this.pageController.clickElement(index)
await this.pageController.inputText(index, text)
await this.pageController.scroll({ down: true, numPages: 1 })يقوم monorepo بتقسيم هذه المخاوف إلى مجموعات صغيرة. @page-agent/core يحمل منطق الوكيل مقطوع الرأس. page-agent هي فئة الدخول الكاملة مع لوحة واجهة المستخدم. @page-agent/page-controller يتعامل مع استخراج DOM وفهرسة العناصر، مع تعليقات مرئية اختيارية من خلال ملف SimulatorMask.
يحتفظ المطورون بالسيطرة على النطاق. تحدد قوائم التشغيل المسموح بها الإجراءات التي قد يقوم الوكيل بتنفيذها. يمكن أن يؤدي إخفاء البيانات إلى إخفاء الحقول الحساسة، مثل كلمات المرور، من النموذج. يمكن إدخال المعرفة المخصصة حتى يتبع الوكيل قواعد المجال الخاص بك.
كيف يقارن
| يقترب | حيث يتم تشغيله | يقرأ الصفحة عبر | يثبت | أفضل ملاءمة |
|---|---|---|---|---|
| وكيل الصفحة | داخل الصفحة (JS من جانب العميل) | النص المجفف DOM | علامة نصية واحدة أو npm | مساعدو الطيارين داخل التطبيقات التي تمتلكها |
| السيلينيوم / الكاتب المسرحي / محرك الدمى | عملية خارجية | DOM عبر برنامج التشغيل (WebDriver/CDP) | برنامج التشغيل بالإضافة إلى وقت التشغيل أو الخادم | اختبار مكتوب من النهاية إلى النهاية |
| استخدام المتصفح | عملية خارجية | DOM بالإضافة إلى الرؤية الاختيارية | بايثون بالإضافة إلى المتصفح | وكلاء مستقلون متعددو المواقع |
| WebMCP | أدوات من جانب الخادم | استدعاءات الوظائف المنظمة | يتطلب اعتماد قياسي | الوصول إلى أداة الوكيل الأصلي |
الوجبات الجاهزة هي النطاق، وليس السرعة. يناسب وكيل الصفحة المنتجات التي تتحكم فيها ويمكنه إضافة تعليمات برمجية إليها. لا تزال برامج التشغيل الخارجية تفوز بالبيئات المقفلة والمسح عبر المواقع.
حالات الاستخدام، مع الأمثلة
- مساعد الطيار SaaS AI: قم بشحن مساعد يقوم بتشغيل المنتج، وليس الشخص الذي يعطي التعليمات فقط. يمكن لروبوت الدعم تنفيذ الخطوات للمستخدم بدلاً من وصفها.
- تعبئة النموذج الذكي: قم بطي نموذج ERP أو CRM متعدد الخطوات في تعليمات واحدة. يقوم أحد المستخدمين بكتابة “أرسل نفقات سفر بمبلغ 50 دولارًا لتناول طعام الغداء بالأمس.” يتولى الوكيل عملية التنقل وإدخال البيانات.
- إمكانية الوصول: قم بإقرانه مع Web Speech API للتحكم الصوتي. يصبح من الممكن الوصول إلى أي تطبيق ويب من خلال اللغة الطبيعية، مع إعلانات سهلة الاستخدام لقارئ الشاشة.
- تحديث التطبيق القديم: يمكنه تغليف أداة داخلية قديمة لا تحتوي على واجهة برمجة التطبيقات. يمكنك إضافة شريط الأوامر دون تغيير التعليمات البرمجية الأصلية.
بداية سريعة
للتقييم، تقوم علامة نصية واحدة بتحميل وكيل الصفحة مع اختبار LLM مجاني:
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/iife/page-agent.demo.js" crossorigin="true"></script>نقطة النهاية التجريبية هذه مخصصة للتقييم الفني فقط. يحتاج استخدام الإنتاج إلى بيانات اعتماد النموذج الخاص بك.
للإنشاء، قم بتثبيت الحزمة وقم بتكوين نقطة النهاية الخاصة بك:
import { PageAgent } from 'page-agent'
const agent = new PageAgent({
model: 'qwen3.5-plus',
baseURL: 'https://dashscope.aliyuncs.com/compatible-mode/v1',
apiKey: 'YOUR_API_KEY',
language: 'en-US',
})
await agent.execute('Click the login button')ال model و baseURL تقبل الحقول أي مزود متوافق مع OpenAI. غالبًا ما يكون تبديل النماذج عبارة عن عنوان URL أساسي وتغيير رئيسي.
ملحوظة: تم تمرير المفتاح إلى new PageAgent السفن داخل حزمة العميل الخاص بك. للإنتاج، طلبات الوكيل من خلال الواجهة الخلفية الخاصة بك بدلاً من ذلك. يمكن للوكيل أيضًا عرض كل إجراء مهم للموافقة عليه قبل تشغيله.
ما الذي ينجح وما لا ينجح
- قصة تكامل قوية: يتم شحن مساعد الطيار في بضعة أسطر من التعليمات البرمجية. لا توجد إعادة كتابة للواجهة الخلفية ولا يوجد امتداد للتوزيع.
- انخفاض تكلفة النموذج: نظرًا لأن النص فقط هو الذي يتحرك، فإنك تتجنب النماذج متعددة الوسائط وتسعيرها. الدقة تأتي من بنية القراءة، وليس من التخمين من وحدات البكسل.
- السلامة المستندة إلى السرعة لها حدود: قواعد مثل “عدم إرسال نموذج دفع تلقائيًا” موجودة في موجه النظام. وهذه أدلة مقنعة، وليست ضمانات صارمة. بالنسبة للإجراءات الحساسة أو المدمرة، احتفظ بالتحقق من جانب الخادم. لا ينبغي أن تكون التعليمات السريعة هي التحكم الوحيد لديك.
- التركيز على صفحة واحدة: تستهدف المكتبة الأساسية التفاعلات ضمن عرض واحد. ولا يمكنه التحرك عبر علامات التبويب أو النوافذ بمفرده. تحتاج أتمتة الصفحات المتعددة إلى ملحق Chrome الاختياري، الذي يتطلب تثبيتًا وأذونات منفصلة. يسمح خادم Beta MCP أيضًا لوكلاء خارجيين، مثل Claude Desktop أو Copilot، بقيادته.
تحقق من جيثب الريبو. أيضا، لا تتردد في متابعتنا على تغريد ولا تنسى الانضمام إلينا 150 ألف + مل والاشتراك في النشرة الإخبارية لدينا. انتظر! هل أنت على برقية؟ الآن يمكنك الانضمام إلينا على التليجرام أيضًا.
هل تحتاج إلى الشراكة معنا للترويج لصفحة GitHub Repo أو صفحة الوجه المعانقة أو إصدار المنتج أو الندوة عبر الويب وما إلى ذلك؟ تواصل معنا
اكتشاف المزيد من كحيل | أخبار التقنية
اشترك للحصول على أحدث التدوينات المرسلة إلى بريدك الإلكتروني.
