تحديد المشاكل وحلّها والتسجيل

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

أدوات تحديد المشاكل وحلّها المتاحة

يتوفّر عدد كبير من الأدوات في المتصفّح لتصحيح الأخطاء وتحديد المشاكل وحلّها أثناء تطوير مشغّل الخدمات. إليك بعض الموارد لمساعدتك على بدء استخدام المتصفح الذي تختاره.

Chrome وEdge

يتضمّن متصفّح Chrome (والإصدارات الحديثة من Edge المستندة إلى محرّك Blink) مجموعة فعّالة من أدوات المطوّرين. تم التطرق إلى بعض هذه الأدوات في وقت سابق ضمن هذه المستندات تحديدًا في أدوات مطوري البرامج في Chrome، ولكن هناك المزيد من الأدوات التي يمكنك اكتشافها:

Firefox

يمكن لمستخدمي Firefox الاطّلاع على الموارد التالية:

برنامج المتصفح Safari

يتضمن Safari حاليًا مجموعة محدودة للغاية من أدوات المطوّرين لتصحيح أخطاء موظفي الخدمة. يمكنك الاطّلاع على مزيد من المعلومات عن هذه المواضيع باستخدام المراجع التالية:

تسجيل مربّع العمل

من أبرز التحسينات التي أدخلها تطبيق Workbox على تجربة المطوّرين، وذلك من خلال التسجيل المفيد. عند تفعيل التسجيل، يسجّل Workbox جميع أنشطته تقريبًا بطريقة فريدة وعملية.

لقطة شاشة لتسجيل الرسائل في Workbox في وحدة التحكّم في "أدوات مطوري البرامج" في Chrome وتتميز رسائل التسجيل بسجلّات وحدة التحكّم العادية التي تحمل شارة Workbox. يمكن توسيع كل رسالة للحصول على مزيد من المعلومات حول تصحيح الأخطاء.

إنّ إصدارات التطوير في Workbox تفعّل التسجيل تلقائيًا، في حين توقِفه إصدارات الإنتاج. هناك خطوات مختلفة للتبديل بين إصدارَي التطوير والإنتاج، بناءً على ما إذا كنت تنشئ حزمة Workbox مخصّصة أو تستخدم نسخة مجمّعة مسبقًا عبر workbox-sw.

مع أداة تجميع أو بدونها

الحزم هي أدوات تحصل على التعليمات البرمجية من وحدات فردية وتنشئ مخرجات JavaScript جاهزة للتشغيل في المتصفح. عند استخدام أداة حِزم، يمكنك أيضًا استخدام مكوّن Workspace الإضافي المتعلّق بالحزمة والذي يساعد في التخزين المؤقّت، مثل workbox-webpack-plugin، أو من خلال جمع منطق التخزين المؤقت لوقت التشغيل في Workbox. في كلتا الحالتين، يتأثر تسجيل Workbox من خلال ضبط وضع إنتاج في إعدادات الحزمة:

  • في حزمة الويب، يمكن ضبط خيار الإعداد mode على 'production' أو 'development'. ستستخدم workbox-webpack-plugin عملية تسجيل الدخول للإنتاج أو التطوير في Workbox استنادًا إلى هذه القيمة.
  • بالنسبة إلى عملية الدمج، تقبل rollup-plugin-workbox خيار ضبط mode الذي يؤثر أيضًا في ما إذا كان مربّع العمل يسجِّل أي عنصر في وحدة التحكّم. إذا كنت تستخدم واجهة برمجة التطبيقات بدون المكوّن الإضافي الخاص بـ Workbox، عليك ضبط @rollup/plugin-replace لاستبدال process.env.NODE_ENV بـ 'development' أو 'production'.

لنفترض أنه يجب تجاوز سلوك التسجيل التلقائي في مرحلة التطوير. في هذه الحالة، من المفترض أن يسمح لك المكوِّن الإضافي Workbox المناسب لأداة الحِزم بترميز تفضيل لسجلات تصحيح الأخطاء في الإعدادات الخاصة به. على سبيل المثال، يمكنك إيقاف تسجيل الدخول إلى Workbox من خلال خيار mode لدى workbox-webpack-plugin في طريقة GenerateSW.

بدون أداة حِزم

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

تعمل الوحدة workbox-sw على تبسيط تحميل وحدات Workbox الأخرى (على سبيل المثال، workbox-routing أو workbox-precaching أو غير ذلك) من شبكة توصيل المحتوى. يعتمد تحميل حِزم التطوير أو حِزم الإنتاج على عنوان URL المستخدَم للوصول إلى تطبيق الويب الخاص بك. وبشكلٍ تلقائي، يحمّل workbox-sw الإصدار التطويري من Workbox إذا كان تطبيق الويب يعمل على http://localhost، وعلى إصدار الإنتاج في جميع الأوقات الأخرى.

يمكنك إلغاء السلوك التلقائي من خلال استدعاء طريقة setConfig في Workbox لضبط خيار debug على true:

// Load workbox-sw from a CDN
importScripts('https://storage.googleapis.com/workbox-cdn/releases/6.2.0/workbox-sw.js');

// This must come before any other workbox.* methods.
workbox.setConfig({
  debug: true
});

// Now use workbox.routing.*, workbox.precaching.*, etc.

إيقاف تسجيل الدخول لإصدارات التطوير في أي سير عمل

سواء كنت تستخدم حزمة أم لا، يمكنك إيقاف جميع إصدارات تطوير تسجيل الدخول من خلال تخصيص true لمتغيّر self.__WB_DISABLE_DEV_LOGS خاص في مشغّل الخدمات:

//
self.__WB_DISABLE_DEV_LOGS = true;

// The rest of your Workbox service worker code goes here

وتتمثل إحدى ميزات هذه الطريقة في أنّها مستقلة تمامًا عن إعدادات أداة الحِزم، وستعمل سواءً كنت تستخدم workbox-sw مباشرةً أو تعتمد على إحدى أدوات الحِزم لتعبئة مشغّل الخدمات المتوافق مع Workbox نيابةً عنك.

معلومات إضافية

إذا كنت لا تزال تواجه صعوبة في معرفة ما يجري على عامل خدمات الذي يحتوي على عربات ولم تكن عملية التسجيل كافية، حاوِل نشر سؤال على الموقع Stack Overflow باستخدام علامة workbox. وإذا لم تتمكن من العثور على إجابة هناك، يمكنك الإبلاغ عن مشكلة في GitHub (بعد الاطّلاع على إرشادات المساهمة). هذا لا يسمح لجمهور عريض من المطورين بقراءة أسئلتك والإجابة عنها فحسب، بل قد تساعد الإجابة عن سؤالك شخصًا ما في الموقف نفسه لاحقًا.