كل المقالات

Browser Tasks: كيفية كشط المواقع التي تعتمد بكثافة على JavaScript

أكثر من 70% من المواقع الإلكترونية الحديثة تحتاج إلى JavaScript لعرض محتواها. إليك كيف تجلب لك Browser Tasks في FourA الصفحة الكاملة عندما تعود طلبات HTTP فارغة.

تعتمد أكثر من 70% من المواقع الإلكترونية الحديثة على JavaScript لعرض محتواها. لا يرى طلب HTTP القياسي سوى هيكل HTML الأولي. يتم تحميل البيانات الفعلية بعد تنفيذ JavaScript، ولهذا السبب تعود أدوات الكشط التقليدية بصفحات فارغة.

تحل Browser Tasks في FourA هذه المشكلة عن طريق تشغيل مثيل Chrome headless حقيقي لكل request.

كيف يعمل ذلك

عندما ترسل مهمة باستخدام type: "browser"، تقوم FourA بما يلي:

  1. تشغيل متصفح Chrome headless
  2. الانتقال إلى URL المستهدف
  3. الانتظار حتى يتم تنفيذ JavaScript واستقرار DOM
  4. الانتظار اختيارياً لظهور محدد CSS معين
  5. إرجاع HTML الذي تم عرضه بالكامل

تحدث العملية بأكملها على البنية التحتية لـ FourA. ستحصل على HTML نظيف دون الحاجة لتثبيت أي متصفح، ودون إعداد Puppeteer، ودون إدارة تحديثات Chrome.

متى تستخدم Browser Tasks

استخدم Browser Tasks عندما:

  • تطبيقات الصفحة الواحدة (React، Vue، Angular)
  • الصفحات ذات المحتوى الذي يتم تحميله تدريجياً (التمرير اللانهائي، أزرار "تحميل المزيد")
  • المواقع التي تتطلب الموافقة على ملفات تعريف الارتباط (cookie) أو إعداد JS الأولي
  • المحتوى الموجود خلف تدفقات المصادقة من جانب العميل

التزم بمهام single عندما:

  • صفحات HTML المعروضة على الخادم (مواقع الأخبار، المدونات، الويكي)
  • واجهات REST APIs التي تعيد JSON مباشرة
  • السرعة هي الأولوية (تستغرق Browser Tasks من 2 إلى 10 ثوانٍ مقارنة بأقل من ثانية واحدة لمهام single)

مثال: كشط تطبيق React

curl -X POST https://eu.api.foura.ai/api/v1/tasks \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "url": "https://example.com/dashboard",
    "type": "browser",
    "options": {
      "waitFor": ".dashboard-content",
      "timeout": 15000
    }
  }'

يخبر محدد waitFor منصة FourA بالانتظار حتى يظهر .dashboard-content في DOM قبل التقاط الصفحة. يضمن هذا تحميل جميع البيانات غير المتزامنة (async).

نصائح الأداء

  • استخدم دائماً waitFor مع محدد معين بدلاً من الاعتماد على المهلات الزمنية (timeouts). هذا أسرع وأكثر موثوقية.
  • اضبط مهلة زمنية (timeout) معقولة. تغطي 15 ثانية معظم تطبيقات SPAs. لا تقم بزيادتها إلا للواجهات الخلفية البطيئة حقاً.
  • استخدم single كخيار افتراضي وانتقل إلى browser فقط عندما يكون المحتوى مفقوداً من الاستجابة (response).

الخطوات التالية

نحن نعمل على قدرات إضافية للمتصفح بما في ذلك التقاط لقطات الشاشة (screenshots)، وإنشاء ملفات PDF، والتنقل متعدد الخطوات (النقر، التمرير، ملء النماذج). ولكن حتى بدون هذه الإضافات، فإن Browser Tasks تعالج بالفعل المشكلة الأكثر شيوعاً: الحصول على المحتوى الفعلي من الصفحات المعروضة بواسطة JavaScript بدلاً من هيكل فارغ.

تحقق من الوثائق للحصول على مقارنة كاملة لأنواع المهام.