ويتوقع المستخدمون أن تبدأ التطبيقات بشكل موثوق عند الاتصال بشبكة بطيئة أو غير مستقرة، أو حتى عند عدم الاتصال بالإنترنت. ويتوقعون أن يكون المحتوى الذي تفاعلوا معه مؤخرًا، مثل المقاطع الصوتية أو التذاكر وبرامج الرحلات، متاحًا وسهل الاستخدام. عندما يكون الطلب غير ممكن، فإنه يتوقع أن يخبره التطبيق بدلاً من أن يفشل أو يتعطل بدون تنبيه. وهم يريدون أن يحدث كل هذا بسرعة. كما ترى في الميلي ثانية تصنع الملايين، حتى 0.1 ثانية من التحسين في مدة التحميل يمكن أن يؤدي إلى زيادة الإحالات الناجحة بنسبة تصل إلى 10%. مشغِّلو الخدمات هم الأداة التي تتيح لتطبيق الويب التقدّمي (PWA) تلبية توقعات المستخدمين.
عندما يطلب أحد التطبيقات موردًا يغطيه نطاق مشغّل الخدمة، يعترض مشغّل الخدمة الطلب ويعمل كخادم وكيل للشبكة، حتى إذا كان المستخدم غير متصل بالإنترنت. بعد ذلك، يمكنه تحديد ما إذا كان يجب عرض المورد من ذاكرة التخزين المؤقت باستخدام واجهة برمجة تطبيقات التخزين المؤقت، أو عرضه من الشبكة كما لو لم يكن هناك عامل خدمة نشط، أو إنشائه من خوارزمية محلية. ويتيح لك هذا توفير تجربة عالية الجودة مثل تجربة تطبيق النظام الأساسي، حتى عندما يكون تطبيقك غير متصل بالإنترنت.
تسجيل مشغّل خدمات
قبل أن يتحكّم مشغّل الخدمات في صفحتك، يجب تسجيلها في تطبيق الويب التقدّمي (PWA). وهذا يعني أنّه في المرة الأولى التي يفتح فيها المستخدم تطبيق الويب التقدّمي (PWA)، ستذهب جميع طلبات الشبكة مباشرةً إلى الخادم لأنّ مشغّل الخدمة لا يمكنه التحكّم في صفحاتك بعد.
بعد التحقّق مما إذا كان المتصفِّح يتوافق مع Service Worker API، يمكن لتطبيق PWA تسجيل مشغّل خدمات. بعد تحميل الخدمة، يضبط مشغّل الخدمة نفسه بين تطبيق الويب التقدّمي (PWA) والشبكة، مع اعتراض الطلبات وعرض الاستجابات المقابلة.
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register("/serviceworker.js");
}
التحقّق مما إذا كان مشغّل الخدمات مسجَّلاً
للتحقّق مما إذا كان مشغّل الخدمات مسجَّلاً، استخدِم أدوات المطوّرين في متصفّحك المفضّل.
في المتصفّحات التي تستخدم Firefox وChromium (مثل Microsoft Edge أو Google Chrome أو Samsung Internet):
- افتح أدوات المطوّرين، ثم انقر على علامة التبويب التطبيق.
- في اللوحة اليمنى، اختَر مشغِّلو الخدمات.
- تأكَّد من أنّ عنوان URL للنص البرمجي لمشغّل الخدمة يظهر بالحالة "تم التفعيل". (لمزيد من المعلومات، راجِع رحلة المستخدِم). في Firefox، يمكن أن تكون الحالة "جري" أو "توقفت".
في Safari:
- انقر على تطوير > عاملو الخدمات.
- تحقَّق من هذه القائمة بحثًا عن إدخال يتضمّن المصدر الحالي. يؤدي النقر فوق هذا الإدخال إلى فتح المفتش فوق سياق عامل الخدمة.
النطاق
ويحدِّد المجلد الذي يضم مشغّل الخدمات نطاقه. يمكن لمشغِّل الخدمات
المقيم في example.com/my-pwa/sw.js التحكّم في أي عملية تنقّل ضمن مسار my-pwa أو ضمنه، مثل example.com/my-pwa/demos/. يمكن لموظفي الخدمة التحكم فقط في العناصر (الصفحات والعاملين، مجتمعين "العملاء") ضمن نطاقهم.
ينطبق هذا النطاق على علامات تبويب المتصفِّح ونوافذ تطبيق الويب التقدّمي (PWA).
يُسمح باستخدام مشغّل خدمات واحد فقط لكل نطاق. عندما يكون مشغّل الخدمات نشطًا وقيد التشغيل، لا يتوفّر عادةً سوى مثيل واحد بغض النظر عن عدد البرامج (نوافذ PWA أو علامات تبويب المتصفّح) في الذاكرة.
يتضمّن Safari إدارة نطاق أكثر تعقيدًا، تُعرَف باسم الأقسام، ما يؤثر في طريقة عمل النطاقات مع إطارات iframe عبر النطاقات. لمزيد من المعلومات حول تنفيذ WebKit، يمكنك الرجوع إلى مشاركة المدونة.
دورة الحياة
لدى مقدّمي الخدمات دورة حياة توضّح طريقة تركيبهم، بشكل منفصل عن عملية تثبيت تطبيق الويب التقدّمي (PWA).
تبدأ دورة حياة عامل الخدمة بتسجيل عامل الخدمات. ثم يحاول
المتصفح تنزيل ملف عامل الخدمات وتحليله. وإذا نجح التحليل،
يتم تنشيط حدث install لعامل الخدمة. يتم تنشيط حدث install
مرة واحدة فقط.
يتم تثبيت مشغّل الخدمات بدون طلب إذن من المستخدم، حتى إذا لم يثبِّت المستخدم تطبيق الويب التقدّمي (PWA). تتوفر Service Worker API حتى على الأنظمة الأساسية التي لا تتيح تثبيت تطبيق الويب التقدّمي (PWA)، مثل Safari وFirefox على أجهزة الكمبيوتر المكتبي.
بعد التثبيت، يجب تفعيل عامل الخدمة حتى يتمكّن من التحكّم في عملائه، بما في ذلك تطبيق الويب التقدّمي (PWA). عندما يكون عامل الخدمات جاهزًا للتحكّم
في عملائه، يتم تنشيط حدث activate. ومع ذلك، لا يمكن تلقائيًا لعامل الخدمة الذي تم تفعيله إدارة الصفحة التي سجّلتها إلى أن تنتقل إلى تلك الصفحة في المرة التالية عن طريق إعادة تحميل الصفحة أو إعادة فتح تطبيق الويب التقدّمي (PWA).
يمكنك رصد الأحداث في النطاق العمومي لمشغّل الخدمات باستخدام الكائن self:
serviceworker.js
// This code executes in its own worker or thread
self.addEventListener("install", event => {
console.log("Service worker installed");
});
self.addEventListener("activate", event => {
console.log("Service worker activated");
});
تعديل تفاصيل مشغّل الخدمات
يتم تحديث مشغّلي الخدمات عندما يكتشف المتصفّح أنّ عامل الخدمة الذي يتحكّم في العميل والإصدار الجديد من ملف عامل الخدمة من الخادم يختلف عن غيره بالبايت.
بعد إجراء عملية التثبيت بنجاح، ينتظر عامل الخدمة الجديد تنشيطه إلى أن يتوقف عامل الخدمة القديم عن التحكّم في أي عملاء. تُسمى هذه الحالة "قيد الانتظار"، وهي الطريقة التي يضمن بها المتصفِّح تشغيل إصدار واحد فقط من عامل الخدمة في كل مرة.
لن يؤدي إعادة تحميل صفحة أو إعادة فتح تطبيق الويب التقدّمي (PWA) إلى فرض سيطرتك على مشغّل الخدمة الجديد. على المستخدم إغلاق جميع علامات التبويب والنوافذ أو الانتقال إليها باستخدام مشغّل الخدمات الحالي، ثم الرجوع إلى الشاشة الرئيسية لمنح عامل الخدمة الجديد إمكانية التحكّم. لمزيد من المعلومات، يُرجى الاطّلاع على دورة حياة عامل الخدمة.
عمر عامل الخدمة
يمكن لعامل الخدمة المثبت والمسجّل إدارة جميع طلبات الشبكة ضمن نطاقه. ويتم تشغيله من خلال سلسلة تعليمات خاصة به، مع إمكانية التحكّم في التفعيل والإنهاء من خلال المتصفّح، ما يتيح عمله حتى قبل فتح تطبيق الويب التقدّمي (PWA) أو بعد إغلاقه. يعمل عمال الخدمة على سلسلة التعليمات الخاصة بهم، ولكن قد لا تستمر حالة الذاكرة بين عمليات تشغيل عامل الخدمة، لذا تأكد من أن أي شيء تريد إعادة استخدامه لكل عملية تشغيل متاح إما في IndexedDB أو مساحة تخزين دائمة أخرى.
إذا لم يكن قيد التشغيل حاليًا، يبدأ عامل الخدمة عندما يتم إرسال طلب الشبكة في نطاقه، أو عند استقبال حدث تشغيلي مثل المزامنة الدورية في الخلفية أو رسالة فورية.
يتم إنهاء عمال الخدمة إذا كانوا غير نشطين لبضع ثوان، أو إذا كانوا مشغولين لفترة طويلة جدًا. وتختلف توقيتات ذلك من متصفّح إلى آخر. إذا تم إنهاء عامل الخدمة وحدث حدث أدى إلى تشغيله، تتم إعادة تشغيله.
الإمكانات
يستخدم مشغّل الخدمات المسجَّل والنشط سلسلة محادثات ذات دورة حياة تنفيذية مختلفة تمامًا عن سلسلة التعليمات الرئيسية لتطبيق الويب التقدّمي (PWA). ومع ذلك، ليس هناك أي سلوك لملف عامل الخدمات نفسه. إنه لن يخزن أو يعرض أي موارد؛ هذه هي الأشياء التي يجب أن تقوم بها التعليمات البرمجية. ستتعرف على كيفية القيام بذلك في الفصول التالية.
لا تُستخدم إمكانات مشغّل الخدمة فقط في الخادم الوكيل أو تقديم طلبات HTTP. تتوفّر ميزات أخرى فوقها لأغراض أخرى، مثل تنفيذ رمز الخلفية والإشعارات الفورية على الويب ومعالجة الدفعات. سنناقش هذه الإضافات في الإمكانات.