क्या आपने कभी सोचा है कि आपके ऑफ़लाइन होने पर भी कुछ वेबसाइटें कैसे काम करती रहती हैं? रहस्य सरल है: इन वेबसाइटों में सेवा कर्मचारी हैं।

आधुनिक वेब अनुप्रयोगों की कई मूल ऐप जैसी सुविधाओं के पीछे सेवा कार्यकर्ता प्रमुख तकनीक हैं।

सेवा कार्यकर्ता क्या हैं?

सेवा कार्यकर्ता एक विशेष प्रकार के होते हैं जावास्क्रिप्ट वेब कार्यकर्ता. सर्विस वर्कर एक जावास्क्रिप्ट फ़ाइल है जो एक प्रॉक्सी सर्वर की तरह काम करती है। यह आपके एप्लिकेशन से आउटगोइंग नेटवर्क अनुरोधों को पकड़ता है, जिससे आप कस्टम प्रतिक्रियाएं बना सकते हैं। उदाहरण के लिए, आप कैश की गई फ़ाइलों को उपयोगकर्ता को तब प्रदान कर सकते हैं जब वे ऑफ़लाइन हों।

सर्विस वर्कर आपको अपने वेब एप्लिकेशन में बैकग्राउंड सिंक जैसी सुविधाएं जोड़ने की सुविधा भी देते हैं।

सेवा कार्यकर्ता क्यों?

वेब डेवलपर लंबे समय से अपने ऐप्स की क्षमताओं का विस्तार करने की कोशिश कर रहे हैं। सेवा कर्मियों के साथ आने से पहले, आप इसे संभव बनाने के लिए विभिन्न समाधानों का उपयोग कर सकते थे। एक विशेष रूप से उल्लेखनीय ऐप कैश था, जिसने कैशिंग संसाधनों को सुविधाजनक बना दिया। दुर्भाग्य से, इसमें ऐसे मुद्दे थे जिन्होंने इसे अधिकांश ऐप्स के लिए एक अव्यवहारिक समाधान बना दिया।

instagram viewer

AppCache एक अच्छा विचार प्रतीत होता है क्योंकि यह आपको संपत्ति को वास्तव में आसानी से कैश करने के लिए निर्दिष्ट करने की अनुमति देता है। हालाँकि, इसने कई धारणाएँ बनाईं कि आप क्या करने की कोशिश कर रहे थे और फिर बुरी तरह से टूट गए जब आपका ऐप उन धारणाओं का बिल्कुल पालन नहीं करता था। जेक आर्चीबाल्ड पढ़ें (दुर्भाग्य से शीर्षक लेकिन अच्छी तरह से लिखा गया) एप्लिकेशन कैश एक डौशबैग है अधिक जानकारी के लिए। (स्रोत: एमडीएन)

AppCache जैसी तकनीक की कमियों के बिना, सेवा कार्यकर्ता वेब ऐप्स की सीमाओं को कम करने का वर्तमान प्रयास हैं।

सेवा कर्मियों के लिए मामलों का प्रयोग करें

तो सेवा कर्मचारी आपको वास्तव में क्या करने देते हैं? सेवा कर्मी आपको ऐसी सुविधाएँ जोड़ने की अनुमति देते हैं जो आपके वेब एप्लिकेशन में मूल ऐप्स की विशेषता हैं। वे उन उपकरणों पर भी सामान्य अनुभव प्रदान कर सकते हैं जो सेवा कर्मियों का समर्थन नहीं करते हैं। इस तरह के ऐप्स को कभी-कभी कहा जाता है प्रोग्रेसिव वेब ऐप्स (PWA).

यहाँ कुछ सुविधाएँ हैं जो सेवा कार्यकर्ता संभव बनाते हैं:

  • जब उपयोगकर्ता अब इंटरनेट से कनेक्ट न हों तो उन्हें ऐप (या इसके कम से कम कुछ हिस्सों) का उपयोग करते रहने दें। सेवा कार्यकर्ता अनुरोधों के जवाब में कैश्ड संपत्तियों की सेवा करके इसे प्राप्त करते हैं।
  • क्रोमियम-आधारित ब्राउज़रों में, एक वेब ऐप के इंस्टाल करने योग्य होने के लिए एक सर्विस वर्कर एक आवश्यकता होती है।
  • आपके वेब एप्लिकेशन के लिए पुश नोटिफिकेशन को लागू करने में सक्षम होने के लिए सेवा कार्यकर्ता आवश्यक हैं।

एक सेवा कार्यकर्ता का जीवनचक्र

सेवा कर्मी पूरी साइट या साइट के पृष्ठों के केवल एक हिस्से के अनुरोधों को नियंत्रित कर सकते हैं। एक विशेष वेबपेज में केवल एक सक्रिय सेवा कार्यकर्ता हो सकता है, और सभी सेवा कर्मचारियों के पास एक घटना-आधारित जीवनचक्र होता है। एक सेवा कार्यकर्ता का जीवन चक्र आम तौर पर इस तरह दिखता है:

  1. कार्यकर्ता का पंजीकरण और डाउनलोड। एक सेवा कार्यकर्ता का जीवन तब शुरू होता है जब एक जावास्क्रिप्ट फ़ाइल इसे पंजीकृत करती है। यदि पंजीकरण सफल होता है, तो सेवा कार्यकर्ता डाउनलोड हो जाता है, और फिर एक विशेष थ्रेड के अंदर चलना शुरू हो जाता है।
  2. जब सर्विस वर्कर द्वारा नियंत्रित पेज लोड किया जाता है, तो सर्विस वर्कर को एक 'इंस्टॉल' इवेंट प्राप्त होता है। यह हमेशा एक सेवा कार्यकर्ता को प्राप्त होने वाली पहली घटना होती है, और आप कार्यकर्ता के अंदर इस घटना के लिए एक श्रोता स्थापित कर सकते हैं। 'इंस्टॉल' ईवेंट का उपयोग आम तौर पर सेवा कार्यकर्ता को आवश्यक किसी भी संसाधन को लाने और/या कैश करने के लिए किया जाता है।
  3. सर्विस वर्कर के इंस्टालेशन को पूरा करने के बाद, उसे एक 'एक्टिवेट' इवेंट प्राप्त होता है। यह घटना कार्यकर्ता को पिछले सेवा कर्मचारियों द्वारा उपयोग किए गए अनावश्यक संसाधनों को साफ करने की अनुमति देती है। यदि आप किसी सेवा कर्मचारी को अपडेट कर रहे हैं, तो सक्रिय ईवेंट केवल तभी सक्रिय होगा जब ऐसा करना सुरक्षित होगा। यह तब होता है जब सेवा कार्यकर्ता के पुराने संस्करण का उपयोग करने वाले अभी भी कोई लोड किए गए पृष्ठ नहीं हैं।
  4. उसके बाद, सेवा कार्यकर्ता के पास उन सभी पृष्ठों का पूर्ण नियंत्रण होता है जो सफलतापूर्वक पंजीकृत होने के बाद लोड किए गए थे।
  5. जीवनचक्र का अंतिम चरण अतिरेक है, जो तब होता है जब सेवा कार्यकर्ता को हटा दिया जाता है या एक नए संस्करण द्वारा प्रतिस्थापित किया जाता है।

जावास्क्रिप्ट में सर्विस वर्कर्स का उपयोग कैसे करें

सेवा कार्यकर्ता एपीआई (एमडीएन) इंटरफ़ेस प्रदान करता है जो आपको जावास्क्रिप्ट में सेवा कर्मियों को बनाने और उनके साथ बातचीत करने की अनुमति देता है।

सेवा कार्यकर्ता मुख्य रूप से नेटवर्क अनुरोधों और अन्य अतुल्यकालिक घटनाओं से निपटते हैं। नतीजतन, सेवा कार्यकर्ता एपीआई का भारी उपयोग करता है वादे और अतुल्यकालिक प्रोग्रामिंग.

सर्विस वर्कर बनाने के लिए सबसे पहले आपको कॉल करना होगा नेविगेटर.सर्विसवर्कर.रजिस्टर () तरीका। यहां बताया गया है कि यह कैसा दिख सकता है:

यदि ('सेवा कार्यकर्ता' नेविगेटर में) {
नेविगेटर.सर्विसवर्कर.रजिस्टर ('/sw.js')। तब (समारोह(पंजीकरण){
कंसोल.लॉग('सेवा कार्यकर्ता पंजीकरण सफल हुआ:', पंजीकरण);
}).कैच ((त्रुटि) => { कंसोल.लॉग ('सेवा कार्यकर्ता पंजीकरण विफल:', गलती); });
} वरना {
कंसोल.लॉग('सेवा कार्यकर्ता समर्थित नहीं हैं।');
}

सबसे बाहरी अगर ब्लॉक फीचर डिटेक्शन करता है। यह सुनिश्चित करता है कि सेवा कार्यकर्ता-संबंधित कोड केवल उन ब्राउज़रों पर चलेगा जो सेवा कर्मियों का समर्थन करते हैं।

अगला, कोड कॉल करता है रजिस्टर करें तरीका। यह इसे पंजीकृत करने और डाउनलोड करने के लिए सेवा कार्यकर्ता (साइट के मूल के सापेक्ष) के पास जाता है। रजिस्टर करें विधि स्कोप नामक एक वैकल्पिक पैरामीटर को भी स्वीकार करती है, जिसका उपयोग कार्यकर्ता द्वारा नियंत्रित पृष्ठों को सीमित करने के लिए किया जा सकता है। सेवा कर्मचारी डिफ़ॉल्ट रूप से किसी एप्लिकेशन के सभी पृष्ठों को नियंत्रित करते हैं। रजिस्टर करें विधि एक वादा लौटाती है जो इंगित करती है कि पंजीकरण सफल रहा या नहीं।

यदि वादा हल हो जाता है, तो सेवा कार्यकर्ता सफलतापूर्वक पंजीकृत हो जाता है। कोड तब कंसोल पर पंजीकृत सेवा कार्यकर्ता का प्रतिनिधित्व करने वाली वस्तु को प्रिंट करता है।

यदि पंजीकरण प्रक्रिया विफल हो जाती है, तो कोड त्रुटि को पकड़ता है और इसे कंसोल में लॉग करता है।

इसके बाद, यहां एक सरलीकृत उदाहरण दिया गया है कि सेवा कर्मी स्वयं कैसा दिखाई दे सकता है:

सेल्फ.एडइवेंट लिस्टनर ('इंस्टॉल', (घटना) => {
घटना.प्रतीक्षा करें(नयावायदा((समाधान, अस्वीकार) => {
कंसोल.लॉग("सेटअप सामान करना")
हल करना()
}))
कंसोल.लॉग("सेवा कार्यकर्ता ने स्थापित करना समाप्त कर दिया")
})

सेल्फ.एडइवेंट लिस्टनर ('सक्रिय', (घटना) => {
घटना.प्रतीक्षा करें(नयावायदा((समाधान, अस्वीकार) => {
कंसोल.लॉग("साफ-सफाई का सामान कर रहे हैं!")
हल करना()
}))
कंसोल.लॉग('सक्रियण हो गया!')
})

सेल्फ.एडइवेंट लिस्टनर ('लाना', (घटना) => {
कंसोल.लॉग("अनुरोध इंटरसेप्ट किया गया", प्रतिस्पर्धा)
});

इस डेमो सेवा कार्यकर्ता के पास तीन ईवेंट श्रोता हैं, जो स्वयं के विरुद्ध पंजीकृत हैं। इसमें 'इंस्टॉल' इवेंट, 'एक्टिवेट' इवेंट और 'फ़ेच' इवेंट के लिए एक है।

पहले दो श्रोताओं के अंदर, कोड का उपयोग करता है तब तक प्रतिक्षा करें जब तक तरीका। यह विधि एक वादा स्वीकार करती है। इसका काम यह सुनिश्चित करना है कि सेवा कार्यकर्ता अगले कार्यक्रम पर जाने से पहले वादे के समाधान या अस्वीकार करने की प्रतीक्षा करेगा।

जब भी सेवा कार्यकर्ता द्वारा नियंत्रित संसाधन के लिए अनुरोध किया जाता है तो फ़ेच श्रोता सक्रिय हो जाता है।

एक सेवा कार्यकर्ता द्वारा नियंत्रित संसाधनों में वे सभी पृष्ठ शामिल होते हैं जिन्हें वह नियंत्रित करता है, साथ ही उन पृष्ठों में संदर्भित सभी संपत्तियां भी शामिल होती हैं।

सेवा कर्मियों के साथ अपने वेब ऐप्स को बेहतर बनाएं

सेवा कार्यकर्ता एक विशेष प्रकार के वेब कार्यकर्ता होते हैं जो एक अद्वितीय उद्देश्य की पूर्ति करते हैं। वे ऑफ़लाइन ऐप एक्सेस जैसी सुविधाओं को सक्षम करने के लिए नेटवर्क अनुरोधों के सामने बैठते हैं। वेब एप्लिकेशन में सर्विस वर्कर्स का उपयोग करने से इसके उपयोगकर्ता अनुभव में काफी सुधार हो सकता है। सर्विस वर्कर एपीआई का उपयोग करके आप सर्विस वर्कर बना सकते हैं और उनके साथ इंटरैक्ट कर सकते हैं।