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 लॉन्च होता है और डाउनलोड होना शुरू हो जाता है.
  • उपयोगकर्ता ने संगीत स्ट्रीम करने का PWA इंस्टॉल किया हो. जब कोई दोस्त web+music://songid=1234&time=0:13 जैसे किसी गाने का लिंक शेयर करता है और उपयोगकर्ता उस पर क्लिक करता है, तो संगीत स्ट्रीमिंग का PWA एक स्टैंडअलोन विंडो में अपने-आप लॉन्च हो जाएगा.

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 को इंस्टॉल करें. प्रोटोकॉल हैंडलर सेक्शन में, "अमेरिका" टाइप करें और PWA में कॉफ़ी पेज खोलने के लिए, प्रोटोकॉल की जांच करें पर क्लिक करें.

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

डेमो

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

एपीआई के साथ काम करता है

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

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

स्वीकार हैं

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