باستخدام وضع "بلا واجهة مستخدم رسومية" في Chrome، يمكنك تشغيل المتصفّح في بيئة غير خاضعة للمراقبة، بدون أي واجهة مستخدم مرئية. وبشكل أساسي، يمكنك تشغيل Chrome بدون Chrome.
يُعد الوضع بلا واجهة مستخدم رسومية خيارًا شائعًا لأتمتة المتصفح، من خلال مشروعات مثل Puppeteer أو ChromeDriver.
استخدام وضع التشغيل بلا واجهة مستخدم رسومية
لاستخدام "وضع التشغيل بلا واجهة مستخدم رسومية"، عليك ضبط علامة سطر الأوامر --headless على النحو التالي:
chrome --headless
استخدام وضع التشغيل بلا واجهة مستخدم رسومية القديم
في السابق، كان وضع "بلا واجهة مستخدم رسومية"
تنفيذ متصفِّح بديل ومنفصل
التي تم شحنها كجزء من برنامج Chrome الثنائي نفسه. لم تتم المشاركة
أي من رموز متصفح Chrome في
//chrome
يتضمّن Chrome الآن أوضاعًا موحَّدة بلا واجهة مستخدم رسومية و"واجهة مستخدم رسومية".
لا يزال وضع "بلا واجهة مستخدم رسومية" القديم متاحًا في الوقت الحالي مع:
chrome --headless=old
في محرّك الدُمى
لاستخدام وضع "بلا واجهة مستخدم رسومية" في Puppeteer:
import puppeteer from 'puppeteer';
const browser = await puppeteer.launch({
headless: 'true', // (default) enables Headless
// `headless: 'old'` enables old Headless
// `headless: false` enables "headful" mode
});
const page = await browser.newPage();
await page.goto('https://developer.chrome.com/');
// …
await browser.close();
مع Selenium-WebDriver
لاستخدام وضع "بدون واجهة مستخدم رسومية" في Selenium-WebDriver:
const driver = await env
.builder()
.setChromeOptions(options.addArguments('--headless'))
.build();
await driver.get('https://developer.chrome.com/');
// …
await driver.quit();
يمكنك الاطّلاع على مشاركة المدونة التي نشرها فريق Seenium للحصول على مزيد من المعلومات، بما في ذلك أمثلة تستخدم روابط لغوية أخرى.
علامات سطر الأوامر
تتوفّر علامات سطر الأوامر التالية في وضع "بلا واجهة مستخدم رسومية".
--dump-dom
تطبع العلامة --dump-dom نموذج كائن المستند (DOM) المتسلسل للصفحة المستهدفة بتنسيق stdout.
على سبيل المثال:
chrome --headless --dump-dom https://developer.chrome.com/
يختلف هذا عن طباعة رمز مصدر HTML، الذي قد تفعله باستخدام
curl لعرض مُخرجات --dump-dom، يحلّل Chrome لغة HTML أولاً.
في DOM، وينفّذ أي <script> قد يغيّر نموذج DOM، ثم
لإعادة تحويل DOM هذا إلى سلسلة تسلسلية من HTML.
--screenshot
تأخذ العلامة --screenshot لقطة شاشة للصفحة المستهدفة وتحفظها باسم
screenshot.png في دليل العمل الحالي. يكون هذا مفيدًا بشكل خاص في
مع العلامة --window-size.
على سبيل المثال:
chrome --headless --screenshot --window-size=412,892 https://developer.chrome.com/
--print-to-pdf
تحفظ العلامة --print-to-pdf الصفحة المستهدَفة كملف PDF باسم output.pdf في
دليل العمل الحالي. على سبيل المثال:
chrome --headless --print-to-pdf https://developer.chrome.com/
يمكنك اختياريًا إضافة علامة --no-pdf-header-footer لحذف النسخة المطبوعة.
رأس (بالتاريخ والوقت الحاليين) والتذييل (مع عنوان URL والصفحة
رقم).
chrome --headless --print-to-pdf --no-pdf-header-footer https://developer.chrome.com/
لا: كانت الوظيفة وراء علامة --no-pdf-header-footer السابقة
متاح مع العلامة --print-to-pdf-no-header. قد تحتاج إلى العودة إلى
اسم العلم القديم، في حال استخدام نسخة سابقة.
--timeout
تحدّد العلامة --timeout الحد الأقصى لوقت الانتظار (بالمللي ثانية) الذي يتم بعده
تم تسجيل محتوى الصفحة من قِبل --dump-dom و--screenshot
--print-to-pdf حتى في حال استمرار تحميل الصفحة.
chrome --headless --print-to-pdf --timeout=5000 https://developer.chrome.com/
تطلب العلامة --timeout=5000 من Chrome الانتظار لمدة تصل إلى 5 ثوانٍ قبل الطباعة.
ملف PDF. ولذلك، يستغرق تنفيذ هذه العملية 5 ثوانٍ على الأكثر.
--virtual-time-budget
يعمل --virtual-time-budget كتقديم سريع لأي رمز برمجي يعتمد على الوقت
(على سبيل المثال، setTimeout/setInterval). تفرض هذه السياسة على المتصفِّح تنفيذ أي رموز.
رمز الصفحة بأسرع وقت ممكن مع جعل الصفحة تعتقد
يمر الوقت بالفعل.
لتوضيح استخدامه، ضع في اعتبارك هذا العرض التوضيحي، الذي
زيادة العدّاد كل ثانية وتسجيله وعرضه
باستخدام setTimeout(fn, 1000). إليك الرمز ذو الصلة:
<output>0</output>
<script>
const element = document.querySelector('output');
let counter = 0;
setInterval(() => {
counter++;
console.log(counter);
element.textContent = counter;
}, 1_000);
</script>
بعد ثانية واحدة، تحتوي الصفحة على "1". بعد ثانيتين، و"2"، وهكذا. وفي ما يلي طريقة تسجيل حالة الصفحة بعد 42 ثانية وحفظها في ملف PDF:
chrome --headless --print-to-pdf --virtual-time-budget=42000 https://mathiasbynens.be/demo/time
--allow-chrome-scheme-url
يجب وضع علامة --allow-chrome-scheme-url للوصول إلى عناوين URL ذات chrome://.
تتوفّر هذه العلامة من الإصدار 123 من Chrome. وفي ما يلي مثال لذلك:
chrome --headless --print-to-pdf --allow-chrome-scheme-url chrome://gpu
تصحيح الأخطاء
قد يبدو الأمر صعبًا لأنّ Chrome غير مرئي في "وضع التشغيل بلا واجهة مستخدم رسومية" لحل مشكلة ما. بات من الممكن تصحيح الأخطاء في Chrome بلا واجهة مستخدم رسومية يشبه متصفح Chrome ذو رأس الصفحة.
شغِّل متصفِّح Chrome في وضع التشغيل بلا واجهة مستخدم رسومية باستخدام
علامة سطر أوامر --remote-debugging-port
chrome --headless --remote-debugging-port=0 https://developer.chrome.com/
يؤدي ذلك إلى طباعة عنوان URL فريد لـ WebSocket لتثبيته بشكل قياسي، على سبيل المثال:
DevTools listening on ws://127.0.0.1:60926/devtools/browser/b4bd6eaa-b7c8-4319-8212-225097472fd9
في نسخة افتراضية من Chrome، يمكننا بعد ذلك استخدام تصحيح الأخطاء عن بُعد في "أدوات مطوري البرامج في Chrome" للاتصال إلى هدف بلا واجهة مستخدم رسومية وفحصه.
- انتقِل إلى
chrome://inspectوانقر على الزر إعداد.... - أدخِل عنوان IP ورقم المنفذ من عنوان URL WebSocket.
- في المثال السابق، أدخلت
127.0.0.1:60926.
- في المثال السابق، أدخلت
- انقر على تم. سترى الهدف البعيد يظهر مع كل علامات التبويب الخاصة به الأهداف الأخرى المدرجة.
- انقر على inspect للوصول إلى "أدوات مطوري البرامج في Chrome" وفحص جهاز التحكّم عن بُعد. هدف بلا واجهة مستخدم رسومية، بما في ذلك العرض المباشر للصفحة
ملاحظات
نتطلّع إلى معرفة ملاحظاتك حول "وضع التشغيل بلا واجهة مستخدم رسومية". في حال حذف أي مشاكل، يُرجى الإبلاغ عن الخطأ.