PWA के लिए, यूआरएल के प्रोटोकॉल हैंडलर का रजिस्ट्रेशन

इंस्टॉल किए गए PWA को, बेहतर अनुभव देने के लिए किसी खास प्रोटोकॉल का इस्तेमाल करने वाले लिंक को मैनेज करने की अनुमति दें.

Thomas Steiner

स्कीम (जिन्हें प्रोटोकॉल भी कहा जाता है) के बारे में जानकारी

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

tel:+1-816-555-1212
mailto:Jane.Doe@example.com
news:comp.infosystems.www.servers.unix
https://web.dev/

यूनिफ़ॉर्म रिसोर्स लोकेटर (यूआरएल) शब्द का मतलब, यूआरआई के सबसेट से है. यह किसी रिसॉर्स की पहचान करने के साथ-साथ, उसके मुख्य ऐक्सेस तरीके (जैसे, उसकी नेटवर्क लोकेशन) के बारे में बताकर, रिसॉर्स को ढूंढने का तरीका भी उपलब्ध कराता है.

registerProtocolHandler() वाले तरीके के बारे में जानकारी

सिर्फ़ सुरक्षित कॉन्टेंट Navigator वाले तरीके का इस्तेमाल करके, registerProtocolHandler() साइटें यह रजिस्टर कर सकती हैं कि वे किसी खास यूआरएल स्कीम को खोल सकती हैं या नहीं. इसलिए, साइटों को इस तरह से तरीका कॉल करना होगा: navigator.registerProtocolHandler(scheme, url). इन दोनों पैरामीटर को इस तरह से परिभाषित किया गया है:

  • scheme: वह स्ट्रिंग जिसमें वह प्रोटोकॉल शामिल होता है जिसे साइट को मैनेज करना है.
  • url: यह एक स्ट्रिंग होती है, जिसमें हैंडलर का यूआरएल होता है. इस यूआरएल में %s शामिल होना चाहिए, जो प्लेसहोल्डर के तौर पर इस्तेमाल किया जाएगा. इसे हैंडल किए जाने वाले यूआरएल से बदल दिया जाएगा.

स्कीम, सुरक्षित सूची में शामिल स्कीम (उदाहरण के लिए, mailto, bitcoin या magnet) में से कोई एक होनी चाहिए या web+ से शुरू होनी चाहिए. इसके बाद, web+ प्रीफ़िक्स के बाद कम से कम एक या उससे ज़्यादा लोअरकेस ASCII अक्षर होने चाहिए. उदाहरण के लिए, web+coffee.

इसे साफ़ तौर पर समझने के लिए, यहां फ़्लो का एक उदाहरण दिया गया है:

  1. उपयोगकर्ता https://coffeeshop.example.com/ पर मौजूद किसी साइट पर जाता है, जो यह कॉल करता है: navigator.registerProtocolHandler('web+coffee', 'coffee?type=%s').
  2. बाद में, https://randomsite.example.com/ पर जाकर, उपयोगकर्ता <a href="web+coffee:latte-macchiato">All about latte macchiato</a> जैसे किसी लिंक पर क्लिक करता है.
  3. इससे ब्राउज़र, इस यूआरएल पर रीडायरेक्ट हो जाता है: https://coffeeshop.example.com/coffee?type=web%2Bcoffee%3A%2F%2Flatte-macchiato. खोज स्ट्रिंग का यूआरएल डिकोड करने के बाद, ?type=web+coffee://latte-macchiato दिखता है.

प्रोटोकॉल हैंडल करने के बारे में जानकारी

PWA के लिए, यूआरएल के प्रोटोकॉल हैंडलर के रजिस्ट्रेशन का मौजूदा तरीका, मेनिफ़ेस्ट की मदद से PWA इंस्टॉलेशन के हिस्से के तौर पर, प्रोटोकॉल हैंडलर के रजिस्ट्रेशन की सुविधा देता है. PWA को प्रोटोकॉल हैंडलर के तौर पर रजिस्टर करने के बाद, जब कोई उपयोगकर्ता किसी ब्राउज़र या प्लैटफ़ॉर्म के हिसाब से बने ऐप्लिकेशन से mailto, bitcoin या web+music जैसी किसी स्कीम वाले हाइपरलिंक पर क्लिक करता है, तो रजिस्टर किया गया PWA खुलेगा और उसे यूआरएल मिलेगा. ध्यान दें कि मैनिफ़ेस्ट के आधार पर रजिस्टर करने का सुझाव और registerProtocolHandler(), दोनों ही प्रैक्टिस में एक जैसी भूमिका निभाते हैं. साथ ही, दोनों ही उपयोगकर्ताओं को बेहतर अनुभव देने की सुविधा देते हैं:

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

उपयोग के उदाहरण

  • किसी वर्ड प्रोसेसिंग PWA में, उपयोगकर्ता को दस्तावेज़ में web+presentations://deck2378465 जैसे प्रज़ेंटेशन का लिंक मिलता है. जब कोई उपयोगकर्ता लिंक पर क्लिक करता है, तो प्रज़ेंटेशन का PWA अपने-आप सही स्कोप में खुल जाता है और स्लाइड डेक दिखाता है.
  • किसी प्लैटफ़ॉर्म के लिए बने चैट ऐप्लिकेशन में, उपयोगकर्ता को चैट मैसेज में magnet यूआरएल का लिंक मिलता है. लिंक पर क्लिक करने के बाद, इंस्टॉल किया गया टोरेंट पीडब्ल्यूए लॉन्च हो जाता है और डाउनलोड होना शुरू हो जाता है.
  • उपयोगकर्ता के पास संगीत स्ट्रीमिंग वाला PWA इंस्टॉल हो. जब कोई दोस्त web+music://songid=1234&time=0:13 जैसे गाने का लिंक शेयर करता है और उपयोगकर्ता उस पर क्लिक करता है, तो संगीत की स्ट्रीमिंग का पीडब्ल्यूए अपने-आप एक स्टैंडअलोन विंडो में लॉन्च हो जाएगा.

PWA के लिए, यूआरएल के प्रोटोकॉल हैंडलर के रजिस्ट्रेशन का इस्तेमाल करने का तरीका

यूआरएल प्रोटोकॉल हैंडलर के रजिस्ट्रेशन के लिए एपीआई, navigator.registerProtocolHandler() के हिसाब से बनाया गया है. इस बार जानकारी को वेब ऐप्लिकेशन मेनिफ़ेस्ट के ज़रिए, "protocol_handlers" नाम की एक नई प्रॉपर्टी में एलान के तौर पर पास किया गया है. यह प्रॉपर्टी, दो ज़रूरी कुंजियों "protocol" और "url" के साथ ऑब्जेक्ट का कलेक्शन लेती है. नीचे दिए गए कोड स्निपेट में, web+tea और web+coffee को रजिस्टर करने का तरीका बताया गया है. वैल्यू, स्ट्रिंग होती हैं. इनमें हैंडलर का यूआरएल होता है. साथ ही, इसमें एस्केप्ट किए गए यूआरएल के लिए ज़रूरी %s प्लेसहोल्डर होता है.

{
  "protocol_handlers": [
    {
      "protocol": "web+tea",
      "url": "/tea?type=%s"
    },
    {
      "protocol": "web+coffee",
      "url": "/coffee?type=%s"
    }
  ]
}

एक ही प्रोटोकॉल के लिए रजिस्टर करने वाले कई ऐप्लिकेशन

अगर एक से ज़्यादा ऐप्लिकेशन, एक ही स्कीम के लिए हैंडलर के तौर पर रजिस्टर करते हैं, जैसे कि mailto प्रोटोकॉल, तो ऑपरेटिंग सिस्टम उपयोगकर्ता को एक पिकर दिखाएगा. साथ ही, उसे यह तय करने की अनुमति देगा कि रजिस्टर किए गए कौनसे हैंडलर का इस्तेमाल करना है.

एक ही ऐप्लिकेशन, कई प्रोटोकॉल के लिए रजिस्टर कर रहा है

ऊपर दिए गए कोड सैंपल में देखा जा सकता है कि एक ही ऐप्लिकेशन, कई प्रोटोकॉल के लिए खुद को रजिस्टर कर सकता है.

ऐप्लिकेशन के अपडेट और हैंडलर रजिस्ट्रेशन

हैंडलर रजिस्टरेशन, ऐप्लिकेशन के दिए गए नए मेनिफ़ेस्ट वर्शन के साथ सिंक किए जाते हैं. इसके दो मामले होते हैं:

  • नया हैंडलर जोड़ने वाला अपडेट, हैंडलर रजिस्ट्रेशन को ट्रिगर करता है. यह ऐप्लिकेशन इंस्टॉल करने से अलग होता है.
  • हैंडलर हटाने वाला अपडेट, हैंडलर को अनरजिस्टर करने की प्रोसेस को ट्रिगर करता है. यह प्रोसेस, ऐप्लिकेशन को अनइंस्टॉल करने की प्रोसेस से अलग होती है.

DevTools में प्रोटोकॉल हैंडलर की डीबगिंग

ऐप्लिकेशन > मेनिफ़ेस्ट पैनल के ज़रिए, प्रोटोकॉल हैंडलर सेक्शन पर जाएं. यहां सभी उपलब्ध प्रोटोकॉल देखे जा सकते हैं और उनकी जांच की जा सकती है.

उदाहरण के लिए, पीडब्ल्यूए का यह डेमो इंस्टॉल करें. प्रोटोकॉल हैंडलर सेक्शन में, "अमेरिकन" टाइप करें. इसके बाद, PWA में कॉफ़ी पेज खोलने के लिए, प्रोटोकॉल की जांच करें पर क्लिक करें.

मेनिफ़ेस्ट पैनल में प्रोटोकॉल हैंडलर

डेमो

Glitch पर, PWA के लिए यूआरएल के प्रोटोकॉल हैंडलर के रजिस्ट्रेशन का डेमो देखा जा सकता है.

  1. https://protocol-handler.glitch.me/ पर जाएं, PWA को इंस्टॉल करें, और इंस्टॉल होने के बाद ऐप्लिकेशन को फिर से लोड करें. ब्राउज़र ने अब PWA को ऑपरेटिंग सिस्टम के साथ web+coffee प्रोटोकॉल के लिए हैंडलर के तौर पर रजिस्टर कर दिया है.
  2. इंस्टॉल किए गए PWA की विंडो में, लिंक पर क्लिक करें https://protocol-handler-link.glitch.me/. इससे, तीन लिंक वाला एक नया ब्राउज़र टैब खुलेगा. पहले या दूसरे (latte macchiato या americano) पर क्लिक करें. इसके बाद, ब्राउज़र आपको एक प्रॉम्प्ट दिखाएगा और पूछेगा कि क्या आपको ऐप्लिकेशन को web+coffee प्रोटोकॉल के लिए प्रोटोकॉल हैंडलर के तौर पर इस्तेमाल करने की अनुमति है. सहमति देने पर, PWA खुल जाएगा और चुनी गई कॉफी दिखेगी.
  3. navigator.registerProtocolHandler() का इस्तेमाल करने वाले ट्रेडिशनल फ़्लो से तुलना करने के लिए, पीडब्ल्यूए में प्रोटोकॉल हैंडलर रजिस्टर करें बटन पर क्लिक करें. फिर ब्राउज़र टैब में तीसरे लिंक (चाय) पर क्लिक करें. यह भी एक प्रॉम्प्ट दिखाएगा, लेकिन इसके बाद PWA को ब्राउज़र विंडो में नहीं, बल्कि टैब में खोलेगा.
  4. किसी प्लैटफ़ॉर्म के लिए बने ऐप्लिकेशन पर, अपने-आप को मैसेज भेजें. जैसे, Windows पर Skype. इसके लिए, <a href="web+coffee://americano">Americano</a> जैसे लिंक का इस्तेमाल करें और उस पर क्लिक करें. यह इंस्टॉल किया गया PWA भी खोल देगा.

यूआरएल प्रोटोकॉल हैंडलर का डेमो, जिसमें बाईं ओर लिंक वाला ब्राउज़र टैब और दाईं ओर स्टैंडअलोन PWA विंडो है.

सुरक्षा से जुड़ी बातें

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

उपयोगकर्ता की ओर से शुरू नहीं की गई नेविगेशन की कोशिशें

नेविगेशन की जो कोशिशें उपयोगकर्ता ने शुरू नहीं की हैं, लेकिन जो प्रोग्राम के हिसाब से किए गए हैं, वे शायद ऐप्लिकेशन न खोलें. कस्टम प्रोटोकॉल यूआरएल का इस्तेमाल सिर्फ़ टॉप-लेवल ब्राउज़िंग कॉन्टेक्स्ट में किया जा सकता है. उदाहरण के लिए, किसी iframe के यूआरएल के तौर पर नहीं.

अनुमति वाले प्रोटोकॉल की सूची

registerProtocolHandler() की तरह ही, प्रोटोकॉल की एक अनुमति वाली सूची होती है. ऐप्लिकेशन, हैंडल करने के लिए इन प्रोटोकॉल को रजिस्टर कर सकते हैं.

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

सुझाव/राय दें या शिकायत करें

Chromium की टीम, PWA के लिए यूआरएल के प्रोटोकॉल हैंडलर के रजिस्ट्रेशन के बारे में आपके अनुभवों के बारे में जानना चाहती है.

हमें एपीआई के डिज़ाइन के बारे में बताएं

क्या एपीआई में ऐसा कुछ है जो आपकी उम्मीद के मुताबिक काम नहीं करता? क्या आपके आइडिया को लागू करने के लिए, कोई तरीका या प्रॉपर्टी मौजूद नहीं है? क्या आपका सुरक्षा मॉडल के बारे में कोई सवाल या टिप्पणी है? उससे जुड़े GitHub repo पर, खास समस्या की शिकायत करें या किसी मौजूदा समस्या में अपने सुझाव जोड़ें.

लागू करने से जुड़ी समस्या की शिकायत करना

क्या आपको Chromium को लागू करने में कोई गड़बड़ी मिली? या क्या इसे लागू करने का तरीका, खास जानकारी से अलग है? new.crbug.com पर जाकर, गड़बड़ी की शिकायत करें. इसमें ज़्यादा से ज़्यादा जानकारी शामिल करें. साथ ही, गड़बड़ी को दोहराने के लिए आसान निर्देश दें. इसके बाद, Components बॉक्स में UI>Browser>WebAppInstalls डालें. Glitch, तुरंत और आसानी से समस्या की जानकारी शेयर करने के लिए बहुत अच्छा है.

एपीआई के लिए सहायता दिखाना

क्या आपको PWA के लिए, यूआरएल के प्रोटोकॉल हैंडलर के रजिस्ट्रेशन का इस्तेमाल करना है? आपकी सार्वजनिक सहायता से, Chromium की टीम को सुविधाओं को प्राथमिकता देने में मदद मिलती है. साथ ही, यह अन्य ब्राउज़र वेंडर को यह भी पता चलता है कि उनकी मदद करना कितना ज़रूरी है.

WICG के Discourse थ्रेड पर बताएं कि आपको इसका इस्तेमाल कैसे करना है. #ProtocolHandler हैशटैग का इस्तेमाल करके, @ChromiumDev को ट्वीट करें और हमें बताएं कि इसका इस्तेमाल कहां और कैसे किया जा रहा है.

स्वीकार की गई

PWA के लिए, यूआरएल के प्रोटोकॉल हैंडलर का रजिस्ट्रेशन लागू किया गया था. साथ ही, इस बारे में जानकारी दी गई थी. इसे Microsoft Edge टीम के फ़ैबियो रोचा, डिएगो गोंज़ालेज़, कॉनर मूडी, और सैमुअल टैंग ने लागू किया था. इस लेख की समीक्षा जो मेडली और फ़ैबियो रोचा ने की है. Unsplash पर JJ Ying की हीरो इमेज.