वेब ऐप्लिकेशन मेनिफ़ेस्ट आईडी प्रॉपर्टी की मदद से, PWA की खास पहचान करना

Pete LePage

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

इस समस्या को हल करने के लिए, वेब ऐप्लिकेशन मेनिफ़ेस्ट स्पेसिफ़िकेशन में एक नई id प्रॉपर्टी दी गई है. इसकी मदद से, PWA के लिए इस्तेमाल किए जाने वाले आइडेंटिफ़ायर को साफ़ तौर पर तय किया जा सकता है. मेनिफ़ेस्ट में id प्रॉपर्टी जोड़ने से, start_url या मेनिफ़ेस्ट की जगह पर निर्भरता हट जाती है. साथ ही, आने वाले समय में इन्हें अपडेट किया जा सकता है.

id प्रॉपर्टी क्या करती है?

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

ब्राउज़र समर्थन

id प्रॉपर्टी के लिए सहायता, Chrome 96 में उपलब्ध है.

अगर मेरे पास बिना id वाला ऐप्लिकेशन है, तो मुझे क्या करना चाहिए?

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

मैं अपना id कैसे तय और सेट करूं?

PWA के लिए id तय करने का सबसे सुरक्षित और सबसे सटीक तरीका, Chrome से कैलकुलेट की गई वैल्यू देखना है.

  1. Chrome 96 या इसके बाद वाले वर्शन का इस्तेमाल करके, DevTools में ऐप्लिकेशन पैनल का मेनिफ़ेस्ट पैनल खोलें.
  2. ऐप्लिकेशन आईडी प्रॉपर्टी के बगल में मौजूद (!) आइकॉन पर कर्सर घुमाएं. (!) टूलटिप आइकॉन सिर्फ़ तब दिखेगा, जब वेब ऐप्लिकेशन मेनिफ़ेस्ट फ़ाइल में, id के बारे में जानकारी नहीं दी गई हो.
  3. टूल टिप में दिखाई गई id वैल्यू को नोट करें (नीचे दिया गया स्क्रीनशॉट देखें).
  4. टूलटिप में दिखाई गई id वैल्यू का इस्तेमाल करके, वेब ऐप्लिकेशन मेनिफ़ेस्ट में id प्रॉपर्टी जोड़ें.

'आईडी' वैल्यू दिखाने वाला टूलटिप.

{
  ...
  id: "/?homescreen=1",
  start_url: "/?homescreen=1",
  ...
}

अगर मैं id सेट न करूं, तो क्या होगा?

चिंता न करें, कुछ भी नहीं मिटेगा. अगर मेनिफ़ेस्ट में वेब ऐप्लिकेशन मेनिफ़ेस्ट में start_url के हिसाब से कोई id नहीं है, तो ब्राउज़र Chrome 96 से एक id जनरेट करेगा.

वेब ऐप्लिकेशन मेनिफ़ेस्ट में id जोड़ने से, start_url और मेनिफ़ेस्ट पाथ को बदलना मुमकिन हो जाता है (अगर उनका खास ऑरिजिन पहले जैसा ही रहे!). ऐसा इसलिए, क्योंकि ब्राउज़र start_url या मेनिफ़ेस्ट पाथ के बजाय, बताए गए id के आधार पर PWA की पहचान करेगा.

मैं इसकी जांच कैसे करूं?

व्यवहार की जांच करने के लिए, यह तरीका अपनाएं:

  1. PWA इंस्टॉल करें.
  2. about://web-app-internals/ खोलें और इंस्टॉल किए गए PWA के लिए, unhashed_app_id और start_url प्रॉपर्टी देखें.
  3. अपने वेब ऐप्लिकेशन मेनिफ़ेस्ट में id प्रॉपर्टी जोड़ें. इसके लिए, ऊपर मैं अपने id का पता कैसे लगाऊं और सेट कैसे करूं में दिया गया तरीका अपनाएं.
  4. chrome://restart का इस्तेमाल करके ब्राउज़र को रीस्टार्ट करें और about://apps से PWA लॉन्च करें. इसके बाद, मेनिफ़ेस्ट फ़ाइल को रीफ़्रेश करने के लिए PWA को बंद करें.
  5. about://web-app-internals/ खोलें और इंस्टॉल किए गए PWA की manifest_id प्रॉपर्टी देखें और पक्का करें कि उसमें कोई बदलाव नहीं हुआ है.
  6. वेब ऐप्लिकेशन मेनिफ़ेस्ट में start_url को बदलें.
  7. chrome://restart का इस्तेमाल करके ब्राउज़र को रीस्टार्ट करें और about://apps से PWA लॉन्च करें. इसके बाद, मेनिफ़ेस्ट फ़ाइल को रीफ़्रेश करने के लिए PWA को बंद करें.
  8. about://web-app-internals/ खोलें और इंस्टॉल किए गए PWA की start_url प्रॉपर्टी देखें, ताकि पुष्टि हो सके कि यह उम्मीद के मुताबिक अपडेट हो गया है.

ज़्यादा रिसॉर्स