पुश नोटिफ़िकेशन की खास जानकारी

इस बारे में खास जानकारी कि पुश नोटिफ़िकेशन क्या हैं, इनका इस्तेमाल क्यों किया जा सकता है, और ये कैसे काम करते हैं.

Kayce Basques
Kayce Basques
Matt Gaunt

पुश नोटिफ़िकेशन क्या हैं?

पुश मैसेज की मदद से, उपयोगकर्ताओं का ध्यान खींचा जा सकता है. भले ही, वे आपकी वेबसाइट का इस्तेमाल न कर रहे हों. इन्हें पुश मैसेज कहा जाता है, क्योंकि उपयोगकर्ताओं के ऐक्टिव न होने पर भी, उन्हें जानकारी "पुश" की जा सकती है. इस कॉन्सेप्ट को बेहतर तरीके से समझने के लिए, पुश टेक्नोलॉजी की तुलना पुल टेक्नोलॉजी से करें.

सूचनाओं से उपयोगकर्ता को जानकारी के छोटे-छोटे हिस्से दिखाए जाते हैं. वेबसाइटें सूचनाओं का इस्तेमाल कर���े, उपयोगकर्ताओं को अहम और समय के हिसाब से ज़रूरी इवेंट या ऐसी कार्रवाइयों के बारे में बता सकती हैं जिन्हें उपयोगकर्ता को करना होगा. अलग-अलग प्लैटफ़ॉर्म पर, सूचनाएं दिखने और उन्हें दिखने का तरीका अलग-अलग होता है:

macOS और Android पर सूचनाओं के उदाहरण.
macOS और Android पर सूचनाओं के उदाहरण.

पुश मैसेज और सूचनाएं, दोनों अलग-अलग टेक्नोलॉजी हैं. हालांकि, ये दोनों एक-दूसरे के साथ काम करती हैं. पुश एक ऐसी टेक्नोलॉजी है जिसकी मदद से, उपयोगकर्ताओं को आपके सर्वर से मैसेज भेजे जा सकते हैं. भले ही, वे आपकी वेबसाइट का इस्तेमाल न कर रहे हों. सूचनाएं, उपयोगकर्ता के डिवाइस पर पुश की गई जानकारी दिखाने की टेक्नोलॉजी है. पुश मैसेज के बिना भी सूचनाओं का इस्तेमाल किया जा सकता है. आने वाले समय में, उपयोगकर्ता को सूचनाएं दिखाए बिना भी पुश मैसेज भेजे जा सकते हैं. इसे साइलेंट पुश कहा जाता है. हालांकि, फ़िलहाल ब्राउज़र इसकी अनुमति नहीं देते. आम तौर पर, इनका इस्तेमाल एक साथ किया जाता है. ऐसा हो सकता है कि तकनीकी जानकारी न रखने वाला उपयोगकर्ता, पुश मैसेज और सूचनाओं के बीच का अंतर न समझ पाए. इस कलेक्शन में, पुश नोटिफ़िकेशन का मतलब है कि किसी मैसेज को पुश करने के बाद, उसे सूचना के तौर पर दिखाना. जब हम पुश मैसेज की बात करते हैं, तो हम खुद ही पुश टेक्नोलॉजी की बात करते हैं. जब हम सूचनाएं कहें, तो हमारा मतलब सूचना देने की टेक्नोलॉजी से है.

पुश नोटिफ़िकेशन का इस्तेमाल क्यों करना चाहिए?

  • उपयोगकर्ताओं के लिए, पुश नोटिफ़िकेशन एक ऐसा तरीका है जिससे उन्हें समय पर, काम की, और सटीक जानकारी मिलती है.
  • वेबसाइट के मालिक के तौर पर, पुश नोटिफ़िकेशन की मदद से उपयोगकर्ता के ��ुड़ाव को बढ़ाया जा सकता है.

पुश नोटिफ़िकेशन कैसे काम करते हैं?

हाई-लेवल पर, पुश नोटिफ़िकेशन लागू करने के लिए ये मुख्य चरण हैं:

  1. उपयोगकर्ता से पुश नोटिफ़िकेशन भेजने की अनुमति मांगने के लिए क्लाइंट लॉजिक जोड़ना. इसके बाद, डेटाबेस में स्टोर करने के लिए, क्लाइंट आइडेंटिफ़ायर की जानकारी को अपने सर्वर पर भेजना.
  2. क्लाइंट के डिवाइसों पर मैसेज पुश करने के लिए, सर्वर लॉजिक जोड़ा जा रहा है.
  3. डिवाइस पर पुश किए गए मैसेज पाने और उन्हें सूचनाओं के तौर पर दिखाने के लिए, क्लाइंट लॉजिक जोड़ना.

इस पेज के बाकी हिस्सों में, इन चरणों के बारे में ज़्यादा जानकारी दी गई है.

पुश नोटिफ़िकेशन भेजने की अनुमति पाना

सबसे पहले, आपकी वेबसाइट को पुश नोटिफ़िकेशन भेजने के लिए, उपयोगकर्ता की अनुमति लेनी होगी. यह उपयोगकर्ता के जेस्चर से ट्रिगर होना चाहिए. जैसे, Do you want to receive push notifications? प्रॉम्प्ट के बगल में मौजूद हां बटन पर क्लिक करना. पुष्टि करने के बाद, Notification.requestPermission() को कॉल करें. उपयोगकर्ता के डिवाइस पर मौजूद ऑपरेटिंग सिस्टम या ब्राउज़र, औपचारिक रूप से पुष्टि करने के लिए कोई खास यूज़र इंटरफ़ेस (यूआई) दिखाएगा. इससे यह पुष्टि की जा सकेगी कि उपयोगकर्ता, पुश नोटिफ़िकेशन के लिए ऑप्ट-इन करना चाहता है. यह यूज़र इंटरफ़ेस (यूआई), अलग-अलग प्लैटफ़ॉर्म पर अलग-अलग होता है.

क्लाइंट को पुश नोटिफ़िकेशन की सदस्यता देना

अनुमति मिलने के बाद, आपकी वेबसाइट को उपयोगकर्ता को पुश नोटिफ़िकेशन की सदस्यता देने की प्रोसेस शुरू करनी होगी. यह Push API का इस्तेमाल करके, JavaScript के ज़रिए किया जाता है. सदस्यता लेने की प्रोसेस के दौरान, आपको पुष्टि करने वाली सार्वजनिक कुंजी देनी होगी. इस बारे में आपको बाद में ज़्यादा जानकारी मिलेगी. सदस्यता की प्रोसेस शुरू करने के बाद, ब्राउज़र किसी वेब सेवा से नेटवर्क अनुरोध करता है. इस सेवा को पुश सेवा कहा जाता है. इस बारे में आपको बाद में ज़्यादा जानकारी मिलेगी.

अगर सदस्यता लेने की प्रोसेस पूरी हो जाती है, तो ब्राउज़र एक PushSubscription ऑब्जेक्ट दिखाता है. आपको इस डेटा को लंबे समय तक सेव करना होगा. आम तौर पर, ऐसा किसी ऐसे सर्वर पर जानकारी भेजकर किया जाता है जिसे आप कंट्रोल करते हैं. इसके बाद, सर्वर उसे डेटाबेस में सेव करता है.

पुश मैसेज भेजने की अनुमति पाएं. PushSubscription पाएं. अपने सर्वर पर PushSubscription भेजें.

पुश मैसेज भेजना

असल में आपका सर्वर, पुश मैसेज को सीधे क्लाइंट को नहीं भेजता. पुश सेवा ऐसा करती है. पुश सेवा, एक वेब सेवा है जिसे उपयोगकर्ता के ब्राउज़र वेंडर कंट्रोल करता है. जब आपको किसी क्लाइंट को पुश नोटिफ़िकेशन भेजना हो, तो आपको पुश सेवा के लिए वेब सेवा का अनुरोध करना होगा. पुश सेवा को भेजे गए वेब सेवा अनुरोध को वेब पुश प्रोटोकॉल अनुरोध कहा जाता है. वेब पुश प्रोटोकॉल अनुरोध में यह जानकारी शामिल होनी चाहिए:

  • मैसेज में कौनसा डेटा शामिल करना है.
  • मैसेज किस क्लाइंट को भेजना है.
  • पुश सेवा को मैसेज डिलीवर करने का तरीका. उदाहरण के लिए, यह तय किया जा सकता है कि पुश सेवा को 10 मिनट बाद मैसेज भेजना बंद कर देना चाहिए.

आम तौर पर, वेब पुश प्रोटोकॉल का अनुरोध, अपने कंट्रोल वाले सर्वर से किया जाता है. बेशक, आपके सर्वर को रॉ वेब सेवा अनुरोध खुद बनाने की ज़रूरत नहीं है. कुछ ऐसी लाइब्रेरी हैं जो आपके लिए यह काम कर सकती हैं, जैसे कि web-push-libs. हालांकि, इसके पीछे का तरीका, एचटीटीपी पर वेब सेवा का अनुरोध है.

आपका सर्वर, पुश सेवा को वेब पुश प्रोटोकॉल का अनुरोध भेजता है और पुश सेवा, उपयोगकर्ता के डिवाइस पर मैसेज को भेजती है.

पुश सेवा आपका अनुरोध स्वीकार करती है, उसकी पुष्टि करती है, और पुश मैसेज को सही क्लाइंट पर ��ेजती है. अगर क्लाइंट का ब्राउज़र ऑफ़लाइन है, तो पुश सेवा, पुश मैसेज को तब तक कतार में रखती है, जब तक ब्राउज़र ऑनलाइन नहीं हो जाता.

हर ब्राउज़र, अपनी पसंद की पुश सेवा का इस्तेमाल करता है. वेबसाइट डेवलपर के तौर पर, उस पर आपका कोई कंट्रोल नहीं होता. यह कोई समस्या नहीं है, क्योंकि वेब पुश प्रोटोकॉल का अनुरोध स्टैंडर्ड होता है. दूसरे शब्दों में, आपको इस बात की चिंता नहीं करनी है कि ब्राउज़र वेंडर कौनसी पुश सेवा का इस्तेमाल कर रहा है. आपको सिर्फ़ यह पक्का करना होगा कि आपका वेब पुश प्रोटोकॉल अनुरोध, स्पेसिफ़िकेशन के मुताबिक हो. स्पेसिफ़िकेशन में बताया गया है कि अनुरोध में कुछ हेडर शामिल होने चाहिए और डेटा को बाइट की स्ट्रीम के तौर पर भेजा जाना चाहिए.

हालांकि, आपको यह पक्का करना होगा कि वेब पुश प्रोटोकॉल का अनुरोध, सही पुश सेवा को भेजा जा रहा है. सदस्यता की प्रोसेस के दौरान, ब्राउज़र से आपको जो PushSubscription डेटा मिलता है उससे यह जानकारी मिलती है. PushSubscription ऑब्जेक्ट इस तरह दिखता है:

{
  "endpoint": "https://fcm.googleapis.com/fcm/send/c1KrmpTuRm…",
  "expirationTime": null,
  "keys": {
    "p256dh": "BGyyVt9FFV…",
    "auth": "R9sidzkcdf…"
  }
}

endpoint का डोमेन मुख्य रूप से पुश सेवा है. endpoint का पाथ, क्लाइंट आइडेंटिफ़ायर की जानकारी होती है. इससे पुश सेवा को यह तय करने में मदद मिलती है कि मैसेज को किस क्लाइंट पर पुश करना है.

keys का इस्तेमाल एन्क्रिप्ट (सुरक्षित) करने के लिए किया जाता है. इसके बारे में आगे बताया गया है.

पुश मैसेज को एन्क्रिप्ट (सुरक्षित) करना

पुश सेवा को भेजा जाने वाला डेटा एन्क्रिप्ट (सुरक्षित) होना चाहिए. इससे पुश सेवा, क्लाइंट को भेजे जा रहे डेटा को नहीं देख पाती. ध्यान रखें कि ब्राउज़र वेंडर यह तय करता है कि किस पुश सेवा का इस्तेमाल करना है. साथ ही, यह भी ध्यान रखें कि पुश सेवा सैद्धांतिक तौर पर असुरक्षित हो सकती है. आपके सर्वर को अपने वेब पुश प्रो��������ल के अनुरोधों को एन्क्रिप्ट करने के लिए, PushSubscription में दिए गए keys का इस्तेमाल करना ह��गा.

वेब पुश प्रोटोकॉल के अनुरोधों पर हस्ताक्षर करना

पुश सेवा की मदद से, किसी दूसरे व्यक्ति को आपके उपयोगकर्ताओं को मैसेज भेजने से रोका जा सकता है. तकनीकी तौर पर, आपको ऐसा करने की ज़रूरत नहीं है. हालांकि, Chrome पर आसानी से लागू करने के लिए, ऐसा करना ज़रूरी है. Firefox पर ऐसा करना ज़रूरी नहीं है. आने वाले समय में, अन्य ब्राउज़र के लिए भी ऐसा करना पड़ सकता है.

इस वर्कफ़्लो में एक निजी पासकोड और सार्वजनिक पासकोड शामिल होता है, जो आपके ऐप्लिकेशन के लिए यूनीक होता है. पुष्टि करने की प्रोसेस कुछ इस तरह काम करती है:

  • निजी और सार्वजनिक पासकोड, एक बार जनरेट किए जाते हैं. निजी और सार्वजनिक कुंजी के कॉम्बिनेशन को ऐप्लिकेशन सर्वर कुंजियां कहा जाता है. इन्हें VAPID कुंजियां भी कहा जा सकता है. VAPID, पुष्टि करने की इस प्रोसेस के बारे में बताने वाला स्पेसिफ़िकेशन है.
  • जब किसी क्लाइंट को अपने JavaScript कोड से पुश नोटिफ़िकेशन की सदस्यता दी जाती है, तो आपको अपनी सार्वजनिक कुंजी देनी होती है. जब पुश सेवा, डिवाइस के लिए endpoint जनरेट करती है, तो वह दी गई सार्वजनिक कुंजी को endpoint से जोड़ देती है.
  • वेब पुश प्रोटोकॉल का अनुरोध भेजने पर, अपनी निजी कुंजी से कुछ JSON जानकारी पर हस्ताक्षर किया जाता है.
  • जब पुश सेवा को आपका वेब पुश प्रोटोकॉल अनुरोध मिलता है, तो वह हस्ताक्षर की गई जानकारी की पुष्टि करने के लिए, सेव की गई सार्वजनिक कुंजी का इस्तेमाल करती है. अगर हस्ताक्षर मान्य है, तो पुश सेवा को पता चलता है कि अनुरोध, मैच करने वाली निजी पासकोड वाले सर्वर से आया है.

पुश मैसेज की डिलीवरी को पसंद के मुताबिक बनाना

वेब पुश प्रोटोकॉल के अनुरोध की खास जानकारी में ऐसे पैरामीटर भी शामिल होते हैं जिनकी मदद से, पुश सेवा को क्लाइंट को पुश मैसेज भेजने के तरीके को पसंद के मुताबिक बनाया जा सकता है. उदाहरण के लिए, इनमें पसंद के मुताबिक बदलाव किए जा सकते हैं:

  • मैसेज का टाइम-टू-लिव (टीटीएल). इससे पता चलता है कि पुश सेवा को कितनी देर तक मैसेज भेजने की कोशिश करनी चाहिए.
  • मैसेज की प्राथमिकता. यह जानकारी तब काम की होती है, जब पुश सेवा सिर्फ़ ज़्यादा प्राथमिकता वाले मैसेज डिलीवर करके, क्लाइंट की बैटरी लाइफ़ को बनाए रख रही हो.
  • किसी मैसेज का विषय, जो उसी विषय के सभी मैसेज की जगह नया मैसेज ले लेता है.

पुश किए गए मैसेज को सूचनाओं के रूप में पाएं और दिखाएं

पुश सेवा को वेब पुश प्रोटोकॉल का अनुरोध भेजने के बाद, पुश सेवा आपके अनुरोध को तब तक कतार में रखती है, जब तक इनमें से कोई एक इवेंट नहीं होता:

  1. क्लाइंट ऑनलाइन आता है और पुश सेवा पुश मैसेज डिलीवर करती है.
  2. मैसेज की समयसीमा खत्म हो जाती है.

जब किसी क्लाइंट ब्राउज़र को पुश किया गया मैसेज मिलता है, तो वह पुश मैसेज के डेटा को डिक्रिप्ट करता है. साथ ही, आपके सेवा देने वाले को push इवेंट भेजता है. सर्विस वर्कर, मूल रूप से JavaScript कोड होता है. यह बैकग्राउंड में तब भी काम कर सकता है, जब आपकी वेबसाइट खुली न हो या ब्राउज़र बंद हो. अपने सर्विस वर्कर के push इवेंट हैंडलर में, आप ServiceWorkerRegistration.showNotification() को कॉल करते हैं, ताकि जानकारी को सूचना के तौर पर दिखाया जा सके.

मैसेज डिवाइस पर पहुंच जाता है. ब्राउज़र सर्विस वर्कर को सक्रिय करता है. पुश इवेंट डिस्पैच किया जाता है.

आगे क्या करना है

कोड लैब