هل تساءلت يومًا كيف يبدو أن بعض مواقع الويب تستمر في العمل حتى عندما تكون غير متصل بالإنترنت؟ السر بسيط: هذه المواقع لديها عمال خدمة.
عمال الخدمة هم التكنولوجيا الرئيسية وراء العديد من الميزات الشبيهة بالتطبيقات الأصلية لتطبيقات الويب الحديثة.
من هم عمال الخدمة؟
عمال الخدمة هم نوع متخصص من عمال الويب جافا سكريبت. عامل الخدمة هو ملف JavaScript يعمل قليلاً مثل الخادم الوكيل. يلتقط طلبات الشبكة الصادرة من تطبيقك ، مما يتيح لك إنشاء استجابات مخصصة. يمكنك ، على سبيل المثال ، تقديم الملفات المخزنة مؤقتًا إلى المستخدم عندما يكون غير متصل بالإنترنت.
يتيح لك عمال الخدمة أيضًا إضافة ميزات مثل مزامنة الخلفية لتطبيقات الويب الخاصة بك.
لماذا عمال الخدمة؟
يحاول مطورو الويب توسيع إمكانيات تطبيقاتهم لفترة طويلة. قبل أن يأتي عمال الخدمة ، يمكنك استخدام حلول مختلفة لجعل ذلك ممكنًا. ومن أبرزها AppCache ، والذي جعل تخزين الموارد في ذاكرة التخزين المؤقت أمرًا مناسبًا. لسوء الحظ ، كانت بها مشكلات جعلتها حلاً غير عملي لمعظم التطبيقات.
يبدو أن AppCache كانت فكرة جيدة لأنها سمحت لك بتحديد الأصول للتخزين المؤقت بسهولة. ومع ذلك ، فقد قام بالعديد من الافتراضات حول ما كنت تحاول القيام به ثم انهار بشكل رهيب عندما لم يتبع تطبيقك هذه الافتراضات تمامًا. اقرأ كتاب جيك أرشيبالد (بعنوان للأسف ولكنه مكتوب جيدًا)
تطبيق ذاكرة التخزين المؤقت هو Douchebag لمزيد من التفاصيل. (مصدر: MDN)
عمال الخدمة هم المحاولة الحالية لتقليل قيود تطبيقات الويب ، دون عيوب التكنولوجيا مثل AppCache.
حالات الاستخدام للعاملين في الخدمة
إذن ما الذي يسمح لك عمال الخدمة بفعله بالضبط؟ يسمح لك عمال الخدمة بإضافة ميزات مميزة للتطبيقات الأصلية إلى تطبيق الويب الخاص بك. يمكنهم أيضًا تقديم تجربة عادية على الأجهزة التي لا تدعم العاملين في الخدمة. تسمى تطبيقات مثل هذه أحيانًا تطبيقات الويب التقدمية (PWAs).
فيما يلي بعض الميزات التي يتيحها عمال الخدمة:
- السماح للمستخدم بالاستمرار في استخدام التطبيق (أو على الأقل أجزاء منه) عندما لا يكون متصلاً بالإنترنت. يحقق عمال الخدمة ذلك من خلال خدمة الأصول المخزنة مؤقتًا استجابة للطلبات.
- في المتصفحات المستندة إلى Chromium ، يعد عامل الخدمة أحد متطلبات تطبيق الويب ليكون قابلاً للتثبيت.
- عمال الخدمة ضروريون لتطبيق الويب الخاص بك حتى يتمكن من تنفيذ دفع الإخطارات.
دورة حياة عامل الخدمة
يجوز للعاملين في الخدمة التحكم في الطلبات الخاصة بالموقع بأكمله ، أو جزء فقط من صفحات الموقع. يمكن أن تحتوي صفحة ويب معينة على عامل خدمة نشط واحد فقط ، ويكون لجميع العاملين في الخدمة دورة حياة قائمة على الحدث. تبدو دورة حياة عامل الخدمة بشكل عام كما يلي:
- تسجيل وتحميل العامل. تبدأ حياة عامل الخدمة عندما يقوم ملف JavaScript بتسجيله. إذا كان التسجيل ناجحًا ، يقوم عامل الخدمة بالتنزيل ، ثم يبدأ التشغيل داخل سلسلة محادثات خاصة.
- عندما يتم تحميل صفحة يتحكم فيها عامل الخدمة ، يتلقى عامل الخدمة حدث "تثبيت". هذا هو دائمًا الحدث الأول الذي يستقبله عامل الخدمة ، ويمكنك إعداد مستمع لهذا الحدث داخل العامل. يتم استخدام حدث "التثبيت" بشكل عام لجلب و / أو تخزين أي موارد يحتاجها عامل الخدمة.
- بعد انتهاء عامل الخدمة من التثبيت ، يتلقى حدث "تنشيط". يسمح هذا الحدث للعامل بتنظيف الموارد الزائدة التي استخدمها عمال الخدمة السابقون. إذا كنت تقوم بتحديث عامل خدمة ، فلن يتم تنشيط حدث التنشيط إلا عندما يكون القيام بذلك آمنًا. هذا مرة واحدة لا توجد صفحات محملة لا تزال تستخدم الإصدار القديم لعامل الخدمة.
- بعد ذلك ، يكون لعامل الخدمة السيطرة الكاملة على جميع الصفحات التي تم تحميلها بعد تسجيلها بنجاح.
- المرحلة الأخيرة من دورة الحياة هي التكرار ، والتي تحدث عند إزالة عامل الخدمة أو استبداله بإصدار أحدث.
كيفية استخدام عمال الخدمة في JavaScript
عامل الخدمة API (MDN) يوفر الواجهة التي تتيح لك إنشاء عمال الخدمة والتفاعل معهم في JavaScript.
يتعامل عمال الخدمة بشكل أساسي مع طلبات الشبكة والأحداث غير المتزامنة الأخرى. نتيجة لذلك ، يستخدم عامل الخدمة API بشكل مكثف الوعود والبرمجة غير المتزامنة.
لإنشاء عامل خدمة ، فإن أول شيء عليك القيام به هو الاتصال بـ navigator.serviceWorker.register () طريقة. إليك ما قد يبدو عليه ذلك:
إذا ('عامل الخدمة' في الملاح) {
navigator.serviceWorker.register ('/ sw.js'). ثم (وظيفة(التسجيل){
console.log ('نجح تسجيل عامل الخدمة:'، التسجيل)؛
}). catch ((خطأ) => {console.log ('فشل تسجيل عامل الخدمة:'، خطأ)؛ });
} آخر {
console.log ('عمال الخدمة غير مدعومين.');
}
الأبعد إذا كانت الكتلة تقوم باكتشاف الميزة. يضمن عدم تشغيل التعليمات البرمجية المتعلقة بعامل الخدمة إلا على المتصفحات التي تدعم عمال الخدمة.
بعد ذلك ، يستدعي الرمز تسجيل طريقة. يمرره المسار إلى عامل الخدمة (نسبة إلى أصل الموقع) لتسجيله وتنزيله. ال تسجيل يقبل الأسلوب أيضًا معلمة اختيارية تسمى النطاق ، والتي يمكن استخدامها للحد من الصفحات التي يتحكم فيها العامل. يتحكم عمال الخدمة في جميع صفحات التطبيق افتراضيًا. ال تسجيل تقوم الطريقة بإرجاع وعد يشير إلى ما إذا كان التسجيل ناجحًا أم لا.
إذا تم حل الوعد ، يتم تسجيل عامل الخدمة بنجاح. يقوم الرمز بعد ذلك بطباعة كائن يمثل عامل الخدمة المسجل إلى وحدة التحكم.
إذا فشلت عملية التسجيل ، فإن الكود يمسك الخطأ ويسجله في وحدة التحكم.
بعد ذلك ، إليك مثال مبسط لما قد يبدو عليه عامل الخدمة نفسه:
self.addEventListener ('تثبيت'، (حدث) => {
event.waitUntil (الجديديعد((حل ، رفض) => {
console.log ("القيام بأشياء الإعداد")
حل()
}))
console.log ("انتهى عامل الخدمة من التثبيت")
})self.addEventListener ('تفعيل'، (حدث) => {
event.waitUntil (الجديديعد((حل ، رفض) => {
console.log ("القيام بأشياء التنظيف!")
حل()
}))
console.log ('تم التفعيل!')
})
self.addEventListener ('أحضر'، (حدث) => {
console.log ("طلب اعتراض"، حدث)
});
عامل الخدمة التجريبية هذا لديه ثلاثة مستمعين للحدث ، مسجلين ضد نفسه. يحتوي على حدث لحدث "التثبيت" وحدث "التنشيط" وحدث "الجلب".
داخل أول مستمعين ، يستخدم الكود امتداد انتظر حتى طريقة. هذه الطريقة تقبل الوعد. وتتمثل مهمتها في التأكد من أن عامل الخدمة سينتظر حل الوعد أو رفضه قبل الانتقال إلى الحدث التالي.
يتم تنشيط مستمع الجلب كلما تم تقديم طلب لمورد يتحكم فيه عامل الخدمة.
تشمل الموارد التي يتحكم فيها عامل الخدمة جميع الصفحات التي يتحكم فيها ، بالإضافة إلى أي أصول مشار إليها في تلك الصفحات.
عزز تطبيقات الويب الخاصة بك مع عمال الخدمة
عمال الخدمة هم نوع خاص من العاملين على الويب يخدمون غرضًا فريدًا. يجلسون أمام طلبات الشبكة لتمكين ميزات مثل الوصول إلى التطبيقات دون اتصال بالإنترنت. يمكن أن يؤدي استخدام عمال الخدمة في تطبيق ويب إلى تحسين تجربة المستخدم بشكل كبير. يمكنك إنشاء عمال الخدمة والتفاعل معهم باستخدام واجهة برمجة تطبيقات عامل الخدمة.
