इंस्टॉल करना

जब उपयोगकर्ता आपका PWA इंस्टॉल कर लेता है, तब यह:

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

ध्यान दें: हर ब्राउज़र और ऑपरेटिंग सिस्टम के हिसाब से इंस्टॉल करने का तरीका अलग-अलग होता है. हालांकि, ब्राउज़र से अपने PWA को इंस्टॉल करने के लिए, आपको किसी तरह का पैकेज बनाने या एक्ज़ीक्यूटेबल बनाने की ज़रूरत नहीं होती.

इंस्टॉल करने की शर्तें

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

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

इंस्टॉल करने की अनुमति देने की ज़रूरी शर्तें अलग-अलग ब्राउज़र में अलग-अलग हैं. इस लेख में Google Chrome की शर्तों के बारे में बताया गया है. साथ ही, इसमें दूसरे ब्राउज़र के लिए ज़रूरी शर्तों के लिंक भी दिए गए हैं.

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

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

डेस्कटॉप इंस्टॉलेशन

फ़िलहाल, डेस्कटॉप PWA को Linux, Windows, macOS, और Chromebook पर Google Chrome और Microsoft Edge पर इंस्टॉल किया जा सकता है. ये ब्राउज़र, यूआरएल बार (नीचे दी गई इमेज देखें) में इंस्टॉल बैज (आइकॉन) दिखाएंगे. इसमें बताया जाएगा कि मौजूदा साइट को इंस्टॉल किया जा सकता है.

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

ब्राउज़र के ड्रॉप-डाउन मेन्यू में "इंस्टॉल करें " आइटम भी शामिल होता है, जिसका इस्तेमाल उपयोगकर्ता कर सकता है:

ध्यान दें: डेस्कटॉप पर Chromium पर आधारित ब्राउज़र, आपको about:apps का इस्तेमाल करके उस ब्राउज़र पर इंस्टॉल किए गए सभी PWA देखने की सुविधा देते हैं.

डेस्कटॉप ऑपरेटिंग सिस्टम पर सिर्फ़ स्टैंडअलोन और कम से कम यूज़र इंटरफ़ेस (यूआई) डिसप्ले मोड काम करते हैं.

डेस्कटॉप पर इंस्टॉल किए गए PWA:

• Windows पीसी के स्टार्ट मेन्यू या स्टार्ट स्क्रीन पर, Linux जीयूआई के डॉक या डेस्कटॉप पर, macOS लॉन्चपैड में या Chromebook के ऐप्लिकेशन लॉन्चर में आइकॉन होना चाहिए.
• जब ऐप्लिकेशन चालू हो, हाल ही में इस्तेमाल किया गया हो या बैकग्राउंड में खोला गया हो, तो ऐप्लिकेशन स्विचर और डॉक में एक आइकॉन होना चाहिए.
• ऐप्लिकेशन खोज में दिखाई दें. उदाहरण के लिए, Windows पर खोजें या macOS पर Spotlight.
• नई सूचनाएं दिखाने के लिए, अपने आइकॉन पर बैज नंबर सेट कर सकते हैं. यह Badging API का इस्तेमाल करके किया जाता है.
• ऐप्लिकेशन शॉर्टकट की मदद से, आइकॉन के लिए ज़रूरत के हिसाब से मेन्यू सेट किया जा सकता है.
• एक ही ब्राउज़र से दो बार इंस्टॉल नहीं किया जा सकता.

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

डेस्कटॉप पर ऐप्लिकेशन इंस्टॉल करने के बाद, उपयोगकर्ता about:apps पर जा सकते हैं. इसके बाद, PWA पर राइट क्लिक करके, "साइन इन होने पर ऐप्लिकेशन चालू करें" को चुन सकते हैं. ऐसा तब किया जा सकता है, जब उपयोगकर्ता को ऐप्लिकेशन खुलने पर अपने-आप खुलने का विकल्प देना हो.

iOS और iPadOS को इंस्टॉल करना

iOS और iPadOS पर, PWA इंस्टॉल करने के लिए ब्राउज़र का प्रॉम्प्ट उपलब्ध नहीं है. इन प्लैटफ़ॉर्म पर PWA को होम स्क्रीन वेब ऐप्लिकेशन भी कहा जाता है. इन ऐप्लिकेशन को, सिर्फ़ Safari में उपलब्ध मेन्यू के ज़रिए होम स्क्रीन पर मैन्युअल तरीके से जोड़ना होगा. हमारा सुझाव है कि आप अपने एचटीएमएल में apple-touch-icon टैग जोड़ें. आइकॉन तय करने के लिए, अपने एचटीएमएल <head> सेक्शन में आइकॉन का पाथ इस तरह शामिल करें:

<link rel="apple-touch-icon" href="/icons/ios.png">

Safari इस जानकारी का इस्तेमाल, शॉर्टकट बनाने के लिए करेगा. Apple डिवाइसों के लिए कोई आइकॉन न देने पर, होम स्क्रीन पर मौजूद आइकॉन, आपके PWA का स्क्रीनशॉट दिखाएगा. यह आइकॉन तब दिखेगा, जब उपयोगकर्ता उसे इंस्टॉल करेगा.

यह समझना ज़रूरी है कि PWA इंस्टॉल करने की सुविधा सिर्फ़ तब उपलब्ध होती है, जब उपयोगकर्ता Safari से आपकी वेबसाइट ब्राउज़ करता है. App Store में उपलब्ध अन्य ब्राउज़र, जैसे कि Google Chrome, Firefox, Opera या Microsoft Edge, होम स्क्रीन पर PWA इंस्टॉल नहीं कर सकते.

होम स्क्रीन पर ऐप्लिकेशन जोड़ने के तरीके यहां दिए गए हैं:

1. शेयर करें मेन्यू खोलें, जो ब्राउज़र में सबसे नीचे या सबसे ऊपर उपलब्ध होता है.
2. होम स्क्रीन पर जोड़ें पर क्लिक करें.
3. ऐप्लिकेशन के नाम की पुष्टि करें. नाम में उपयोगकर्ता बदलाव कर सकता है.
4. जोड़ें पर क्लिक करें. iOS और iPadOS पर, होम स्क्रीन पर वेबसाइटों और PWA के बुकमार्क एक जैसे दिखते हैं.

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

चेतावनी: Apple डिवाइसों पर, एक ही PWA को कई बार इंस्टॉल किया जा सकता है. हर इंस्टॉल के लिए अलग स्टोरेज होगा और इसे एक अलग ऐप्लिकेशन माना जाएगा.

iOS और iPadOS पर इंस्टॉल किए गए PWA:

• ये विज्ञापन होम स्क्रीन, Spotlight की खोज, Siri के सुझाव, और ऐप्लिकेशन लाइब्रेरी की खोज में दिखते हैं.
• ऐप्लिकेशन गैलरी के कैटगरी फ़ोल्डर में न दिखाएं.
• बैज और ऐप्लिकेशन शॉर्टकट जैसी सुविधाओं के लिए सहायता उपलब्ध न होना.

खास बात यह है कि ऑपरेटिंग सिस्टम में PWA आइकॉन बनाने के लिए, Safari एक खास टेक्नोलॉजी का इस्तेमाल करता है. इस टेक्नोलॉजी को वेब क्लिप कहा जाता है. फ़ाइल सिस्टम में सेव किए गए Apple के प्रापर्टी सूची फ़ॉर्मैट में ये सिर्फ़ एक्सएमएल फ़ाइलें होती हैं.

जब उपयोगकर्ता PWA का इस्तेमाल करते हैं, लेकिन वे Safari ऐप्लिकेशन के इंस्टेंस (जैसे कि Chrome के इंस्टेंस का इस्तेमाल करते हैं) का इस्तेमाल नहीं करते हैं, तब वे Web.app नाम का इस्तेमाल करते हैं. इसलिए, आपको Safari में रेंडर होने वाले PWA और PWA विंडो के बीच थोड़ा अंतर दिख सकता है. Safari और Web.app, दोनों WebKit के लिए एक ही कोर और एक ही JavaScript रनटाइम का इस्तेमाल करते हैं. हालांकि, वे अलग-अलग प्रोसेस में चलते हैं और उन्हें लागू करने का तरीका अलग-अलग हो सकता है. जैसे, आइसोलेटेड स्टोरेज.

Android इंस्टॉलेशन

Android पर, डिवाइस और ब्राउज़र के हिसाब से PWA इंस्टॉल के प्रॉम्प्ट अलग-अलग होते हैं. उपयोगकर्ताओं को यह जानकारी दिख सकती है:

• इंस्टॉल करने के लिए, मेन्यू आइटम के अलग-अलग शब्द, जैसे कि इंस्टॉल करें या होम स्क्रीन पर जोड़ें.
• इंस्टॉल करने के बारे में ज़्यादा जानकारी देने वाले डायलॉग.

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

डिवाइस और ब्राउज़र के आधार पर, आपके PWA को WebAPK, शॉर्टकट या QuickApp के तौर पर इंस्टॉल किया जाएगा.

WebAPKs

WebAPK, एक Android पैकेज (APK) है जिसे उपयोगकर्ता के डिवाइस की सेवा देने वाली किसी भरोसेमंद कंपनी ने बनाया है. यह आम तौर पर क्लाउड में, WebAPK मिनिंग सर्वर पर बनाया जाता है. इस तरीके का इस्तेमाल, Google Chrome उन डिवाइसों पर किया जाता है जिनमें Google Mobile Services (GMS) इंस्टॉल हो. साथ ही, Samsung के इंटरनेट ब्राउज़र पर भी इसका इस्तेमाल किया जा सकता है. हालांकि, सिर्फ़ Samsung के बनाए हुए डिवाइसों, जैसे कि Galaxy फ़ोन या टैबलेट पर ही Google Chrome इसका इस्तेमाल करता है. इसे एक साथ इस्तेमाल करने से, Android इस्तेमाल करने वाले ज़्यादातर लोग इसी का इस्तेमाल करते हैं.

जब कोई उपयोगकर्ता Google Chrome से PWA इंस्टॉल करता है और WebAPK का इस्तेमाल किया जाता है, तो मिंट करने वाला सर्वर "मिंट" (पैकेज) होता है और PWA के लिए किसी APK पर हस्ताक्षर करता है. इस प्रोसेस में समय लगता है, लेकिन APK तैयार होने पर ब्राउज़र, उपयोगकर्ता के डिवाइस पर उस ऐप्लिकेशन को बिना किसी रुकावट के इंस्टॉल करता है. सेवा देने वाली भरोसेमंद कंपनियों (Play सेवाएं या Samsung) ने APK पर हस्ताक्षर किया है. इसलिए, फ़ोन, सुरक्षा से जुड़ी सेटिंग बंद किए बिना APK इंस्टॉल करता है, जैसा कि स्टोर से आने वाले किसी भी ऐप्लिकेशन में होता है. ऐप्लिकेशन को अलग से लोड करने की कोई ज़रूरत नहीं है.

WebAPK से इंस्टॉल किए गए PWA:

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

वेबAPK का इस्तेमाल करने के दौरान, आपको PWA डेवलपर के तौर पर कोई पैकेज बनाने या साइन करने की ज़रूरत नहीं है. यह सब ब्राउज़र, डिवाइस, और मिंटिंग सर्वर के बीच पारदर्शी तरीके से किया जाता है.

शॉर्टकट

WebAPK, Android उपयोगकर्ताओं को सबसे अच्छा अनुभव देते हैं. हालांकि, ये हमेशा नहीं बनाए जा सकते. जब ऐसा नहीं हो सकता, तो ब्राउज़र फिर से वेबसाइट शॉर्टकट बना लेते हैं. क्योंकि Firefox, Microsoft Edge, Opera, Brave (Samsung डिवाइसों पर) के भरोसेमंद मिंटिंग सर्वर नहीं होते, इसलिए वे शॉर्टकट बना लेते हैं. अगर मिंट करने की सेवा उपलब्ध न हो या आपका PWA, इंस्टॉल करने की ज़रूरी शर्तों को पूरा न करता हो, तब भी Google Chrome ऐसा करेगा.

शॉर्टकट के साथ इंस्टॉल किए गए PWA:

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

QuickApps

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

जब आपके PWA को QuickApp के तौर पर इंस्टॉल किया जाएगा, तो उपयोगकर्ताओं को वैसा ही अनुभव मिलेगा जैसा उन्हें शॉर्टकट के साथ मिलता है. हालांकि, इसके आइकॉन के साथ QuickApps आइकॉन (एक लाइटनिंग इमेज) जुड़ा है. यह ऐप्लिकेशन, QuickApp Center से भी लॉन्च करने के लिए उपलब्ध होगा.

इंस्टॉल करने के लिए अनुरोध करना

डेस्कटॉप और Android डिवाइसों पर Chromium पर आधारित ब्राउज़र में, आपके PWA से ब्राउज़र इंस्टॉल करने के डायलॉग को ट्रिगर किया जा सकता है. इंस्टॉलेशन प्रॉम्प्ट चैप्टर में, ऐसा करने के पैटर्न और उन्हें लागू करने के तरीके के बारे में बताया गया है.

चेतावनी: अगर आप उपयोगकर्ता को निर्देश देते हैं, तो याद रखें कि मेन्यू आइटम के नाम भाषा के हिसाब से अलग-अलग होते हैं.

ऐप्लिकेशन कैटलॉग और स्टोर

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

ऐसे ऐप्लिकेशन कैटलॉग और स्टोर जो PWA पब्लिश करने की सुविधा देते हैं:

• Android और ChromeOS के लिए Google Play Store, जिसमें भरोसेमंद वेब गतिविधि का इस्तेमाल किया जा रहा हो.
• iOS, macOS, और iPadOS के लिए, Apple App Store पर WKWebView और ऐप्लिकेशन-बाउंड डोमेन का इस्तेमाल किया जा सकता है.
• APPX पैकेज का इस्तेमाल करने वाले, Windows 10 और 11 के लिए Microsoft Store.
• Samsung Galaxy Store, Samsung WebAPK मिंटिंग सर्वर का इस्तेमाल करके.
• आपके एचटीएमएल ऐप्लिकेशन के लिए QuickApp कंटेनर का इस्तेमाल करके, हुअवी AppGallery.

ऐप्लिकेशन कैटलॉग और स्टोर पर PWA को पब्लिश करने के तरीके के बारे में ज़्यादा जानने के लिए, BubbleWwrap CLI और PWA Builder देखें.

चेतावनी: कुछ ऐप्लिकेशन कैटलॉग और स्टोर के लिए, तकनीकी या कारोबार से जुड़ी शर्तें पूरी करनी होती हैं. ये शर्तें, आपके PWA को पब्लिकेशन के लिए स्वीकार किए जाने से पहले की होती हैं. शुरू करने से पहले, हर स्टोर से जुड़ी ज़रूरी शर्तें देखें.

रिसॉर्स

• इंस्टॉल करने के लिए क्या ज़रूरी है
• Android पर WebAPK
• PWA इंस्टॉल करने के प्रमोशन के लिए पैटर्न
• अपने Android ऐप्लिकेशन में PWA का इस्तेमाल करना
• Google Play में अपने प्रोग्रेसिव वेब ऐप्लिकेशन को लिस्ट करना
• Microsoft Store में अपना PWA सबमिट करना
• App Store पर PWA को पब्लिश करना
• WebKit: ऐप्लिकेशन-बाउंड डोमेन