अपने वेब ऐप्लिकेशन को स्थानीय तौर पर टेस्ट करें, दूसरों के साथ बदलाव शेयर करें, और उसे लाइव डिप्लॉय करें

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

शुरू करने से पहले

Hosting शुरू करें पेज पर दिए गए चरणों को पूरा करें. खास तौर पर, ये काम करें:

1. Firebase सीएलआई को इंस्टॉल करें या इसके नए वर्शन पर अपडेट करें.
2. अपने Firebase प्रोजेक्ट से लोकल प्रोजेक्ट डायरेक्ट्री (जिसमें आपके ऐप्लिकेशन का कॉन्टेंट शामिल है) कनेक्ट करें.

आपके पास अपने ऐप्लिकेशन के Hosting कॉन्टेंट और कॉन्फ़िगरेशन को डिप्लॉय करने का विकल्प होता है. हालांकि, इस पेज पर दिए गए चरणों के लिए, यह ज़रूरी नहीं है.

हमारा सुझाव है कि आप अपने वेब ऐप्लिकेशन को टेस्ट करने और डेवलप करने के लिए, एक अलग Firebase प्रोजेक्ट सेट अप करें. इससे आपको टेस्टिंग और डेवलपमेंट के दौरान, अपने प्रोजेक्ट के संसाधनों (डेटाबेस, स्टोरेज, नियम, फ़ंक्शन वगैरह) में अनजाने में होने वाले बदलावों से अपनी प्रोडक्शन साइट को सुरक्षित रखने में मदद मिलेगी.

पहला चरण: स्थानीय तौर पर जांच करना

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

Hosting, Firebase Local Emulator Suite का हिस्सा है. इसकी मदद से आपका ऐप्लिकेशन, आपके नकल किए गए Hosting कॉन्टेंट और कॉन्फ़िगरेशन के साथ इंटरैक्ट कर सकता है. साथ ही, यह विकल्प के तौर पर आपके नकली प्रोजेक्ट रिसॉर्स (फ़ंक्शन, डेटाबेस, और नियम) के साथ इंटरैक्ट करने की सुविधा देता है.

1. (ज़रूरी नहीं) डिफ़ॉल्ट रूप से, स्थानीय तौर पर होस्ट किया गया आपका ऐप्लिकेशन, प्रोजेक्ट के असल संसाधनों (फ़ंक्शन, डेटाबेस, नियम वगैरह) के साथ इंटरैक्ट करेगा, न कि इम्यूलेट किए गए संसाधनों के साथ. इसके बजाय, आपके पास अपने ऐप्लिकेशन को एमुलेट किए गए किसी भी प्रोजेक्ट के उन संसाधनों का इस्तेमाल करने के लिए कनेक्ट करने का विकल्प है जिन्हें आपने कॉन्फ़िगर किया है. ज़्यादा जानें: Realtime Database | Cloud Firestore | Cloud Functions

2. अपनी लोकल प्रोजेक्ट डायरेक्ट्री के रूट से, यह कमांड चलाएं:

   firebase emulators:start

3. अपना वेब ऐप्लिकेशन, सीएलआई (आम तौर पर http://localhost:5000) से मिले लोकल यूआरएल पर खोलें.

4. बदलावों के साथ लोकल यूआरएल को अपडेट करने के लिए, अपने ब्राउज़र को रीफ़्रेश करें.

अन्य स्थानीय डिवाइसों से जांच करना

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

"emulators": {
    // ...

    "hosting": {
      "port": 5000,
      "host": "0.0.0.0"
    }
  }

firebase serve का इस्तेमाल करके स्थानीय तौर पर जांच करें (इसका सुझाव नहीं दिया जाता)

firebase serve का सुझाव नहीं दिया जाता. इसके बजाय, हमारा सुझाव है कि Firebase Local Emulator Suite की मदद से स्थानीय तौर पर जांच करें.

firebase serve का इस्तेमाल करते समय, आपका ऐप्लिकेशन आपके Hosting कॉन्टेंट और कॉन्फ़िगरेशन (और ज़रूरत पड़ने पर फ़ंक्शन) के लिए, इम्यूलेट किए गए बैकएंड के साथ इंटरैक्ट करता है. हालांकि, प्रोजेक्ट के अन्य सभी संसाधनों के लिए, आपके असल बैकएंड के साथ इंटरैक्ट करता है.

1. अपनी लोकल प्रोजेक्ट डायरेक्ट्री के रूट से, यह कमांड चलाएं:

   firebase serve --only hosting

   ध्यान दें: --only hosting फ़्लैग के साथ इस कमांड को चलाने पर, सिर्फ़ Hosting कॉन्टेंट और कॉन्फ़िगरेशन को एमुलेट किया जाता है. अगर आपको इसके अलावा फ़ंक्शन भी एमुलेट करने हैं, तो इस कमांड को फ़्लैग --only hosting,functions के साथ चलाएं.

2. सीएलआई से मिले लोकल यूआरएल (आम तौर पर http://localhost:5000) पर अपना वेब ऐप्लिकेशन खोलें.

3. लोकल यूआरएल को बदलावों के साथ अपडेट करने के लिए, अपना ब्राउज़र रीफ़्रेश करें.

अन्य स्थानीय डिवाइसों से जांच करने के लिए, firebase serve का इस्तेमाल करना

डिफ़ॉल्ट रूप से, firebase serve सिर्फ़ localhost से मिले अनुरोधों का जवाब देता है. इसका मतलब है कि होस्ट किए गए कॉन्टेंट को अपने कंप्यूटर के वेब ब्राउज़र से ऐक्सेस किया जा सकता है, लेकिन अपने नेटवर्क के दूसरे डिवाइसों से नहीं. अगर आपको किसी दूसरे स्थानीय डिवाइस से जांच करनी है, तो --host फ़्लैग का इस्तेमाल करें. जैसे:

firebase serve --host 0.0.0.0  // accepts requests to any host

दूसरा चरण: झलक देखना और शेयर करना

आपके वेब ऐप्लिकेशन में किए गए बदलावों को लाइव होने से पहले अगर आपको दूसरों को दिखाना है, तो चैनलों की झलक देखें.

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

ध्यान दें कि झलक के यूआरएल का अनुमान लगाना मुश्किल होता है, क्योंकि इनमें एक रैंडम हैश होता है. हालांकि, ये यूआरएल सार्वजनिक होते हैं. इसलिए, जिस व्यक्ति के पास यूआरएल है वह इसे ऐक्सेस कर सकता है.

1. अपनी लोकल प्रोजेक्ट डायरेक्ट्री के रूट से, यह कमांड चलाएं:

   firebase hosting:channel:deploy CHANNEL_ID

   CHANNEL_ID को ऐसी स्ट्रिंग से बदलें जिसमें कोई स्पेस न हो (उदाहरण के लिए, feature_mission-2-mars). इस आईडी का इस्तेमाल, विज्ञापन की झलक दिखाने वाले चैनल से जुड़ा, झलक दिखाने वाला यूआरएल बनाने के लिए किया जाएगा.

   ध्यान दें: आपको --only hosting फ़्लैग पास करने की ज़रूरत नहीं है, क्योंकि यह निर्देश सिर्फ़ आपके Hosting कॉन्टेंट और कॉन्फ़िगरेशन (आपके रीराइट कॉन्फ़िगरेशन में मौजूद, "पिन किए गए" फ़ंक्शन के साथ) को भी डिप्लॉय करता है. झलक वाले यूआरएल पर दिखाए जाने वाले ऐप्लिकेशन, हमेशा प्रोजेक्ट के असल संसाधनों के साथ इंटरैक्ट करते हैं. हालांकि, डिप्लॉय किए गए "पिन किए गए" फ़ंक्शन के साथ ऐसा नहीं होता.

2. सीएलआई से मिले झलक वाले यूआरएल पर अपना वेब ऐप्लिकेशन खोलें. यह कुछ ऐसा दिखेगा: PROJECT_ID--CHANNEL_ID-RANDOM_HASH.web.app

3. बदलावों के साथ झलक का यूआरएल अपडेट करने के लिए, वही कमांड फिर से चलाएं. पक्का करें कि निर्देश में वही CHANNEL_ID दिया गया हो.

झलक वाले चैनलों को मैनेज करने के बारे में जानें. इसमें, चैनल के खत्म होने की तारीख सेट करने का तरीका भी शामिल है.

Firebase Hosting, GitHub की ऐसी कार्रवाई के साथ काम करता है जो पुल के अनुरोध में बदलाव करने पर, झलक वाला यूआरएल अपने-आप बनाता और अपडेट करता है. इस GitHub ऐक्शन को सेट अप और इस्तेमाल करने का तरीका जानें.

तीसरा चरण: लाइव डिप्लॉय करना

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

पहला विकल्प: प्रीव्यू चैनल से अपने लाइव चैनल पर क्लोन करना

इस विकल्प की मदद से, यह पक्का किया जा सकता है कि आपने अपने लाइव चैनल पर वही कॉन्टेंट और कॉन्फ़िगरेशन डिप्लॉय किया है जिसकी झलक वाले चैनल पर आपने जांच की थी. क्लोनिंग वर्शन के बारे में ज़्यादा जानें.

1. किसी भी डायरेक्ट्री से, यह कमांड चलाएं:

   firebase hosting:clone SOURCE_SITE_ID:SOURCE_CHANNEL_ID TARGET_SITE_ID:live

   हर प्लेसहोल्डर को इनसे बदलें:

   • SOURCE_SITE_ID और TARGET_SITE_ID: ये उन Hosting साइटों के आईडी हैं जिन पर चैनल मौजूद हैं.

     • अपनी डिफ़ॉल्ट Hosting साइट के लिए, अपने Firebase प्रोजेक्ट आईडी का इस्तेमाल करें.
     • एक ही Firebase प्रोजेक्ट या अलग-अलग Firebase प्रोजेक्ट में मौजूद साइटों को चुना जा सकता है.

   • SOURCE_CHANNEL_ID: यह उस चैनल का आइडेंटिफ़ायर है जिस पर फ़िलहाल वह वर्शन उपलब्ध है जिसे आपको अपने लाइव चैनल पर डिप्लॉय करना है.

     • लाइव चैनल के लिए, चैनल आईडी के तौर पर live का इस्तेमाल करें.

2. अपने बदलाव देखें (अगला चरण).

दूसरा विकल्प: अपनी लोकल प्रोजेक्ट डायरेक्ट्री से लाइव चैनल पर डिप्लॉय करना

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

1. अपनी लोकल प्रोजेक्ट डायरेक्ट्री के रूट से, यह कमांड चलाएं:

   firebase deploy --only hosting

   ध्यान दें: इस कमांड को --only hosting फ़्लैग के साथ चलाने पर, सिर्फ़ Hosting कॉन्टेंट और कॉन्फ़िगरेशन को डिप्लॉय किया जा सकता है. साथ ही, रीराइट कॉन्फ़िगरेशन में मौजूद सभी "पिन किए गए" फ़ंक्शन भी डिप्लॉय किए जा सकते हैं. अगर आपको इसके अलावा अन्य प्रोजेक्ट संसाधन या कॉन्फ़िगरेशन (जैसे, बैकएंड से ट्रिगर होने वाले फ़ंक्शन या Cloud Storage नियम) भी डिप्लॉय करने हैं, तो इस कमांड को फ़्लैग में कॉमा लगाकर अलग-अलग वैल्यू के साथ चलाएं. उदाहरण के लिए, --only hosting,storage.

2. अपने बदलाव देखें (अगला चरण).

ध्यान दें: Spark प्लान के प्रोजेक्ट के लिए, Firebase Cloud Storage for Firebase और Firebase Hosting की मदद से, Windows (.exe, .dll, और .bat एक्सटेंशन वाली फ़ाइलें), Android (.apk एक्सटेंशन), और Apple (.ipa एक्सटेंशन) के लिए, कुछ तरह की रन की जा सकने वाली फ़ाइलों को अपलोड और होस्ट करने पर रोक लगाता है. यह नीति, हमारे प्लैटफ़ॉर्म पर गलत इस्तेमाल को रोकने के लिए बनी है. ब्लेज़ प्लान के प्रोजेक्ट पर इसका कोई असर नहीं पड़ेगा. ज़्यादा जानकारी के लिए, अक्सर पूछे जाने वाले सवाल देखें.

चौथा चरण: लाइव साइट पर बदलाव देखना

ऊपर दिए गए दोनों विकल्प, आपके Hosting कॉन्टेंट और कॉन्फ़िगरेशन को इन साइटों पर डिप्लॉय करते हैं:

• आपकी डिफ़ॉल्ट Hosting साइट और किसी भी अन्य Hosting साइट के लिए, Firebase से उपलब्ध कराए गए सबडोमेन:
  SITE_ID.web.app (जैसे, PROJECT_ID.web.app)
  SITE_ID.firebaseapp.com (जैसे, PROJECT_ID.firebaseapp.com)

• ऐसे सभी कस्टम डोमेन जिन्हें आपने अपनी Hosting साइटों से कनेक्ट किया है

किसी खास Hosting साइट पर डिप्लॉय करने के लिए, अपने सीएलआई कमांड में डिप्लॉय का टारगेट तय करें.

डिप्लॉय करने से जुड़ी अन्य गतिविधियां और जानकारी

डिप्लॉय के लिए टिप्पणी जोड़ना

आपके पास डिप्लॉयमेंट में टिप्पणी जोड़ने का विकल्प होता है. हालांकि, ऐसा करना ज़रूरी नहीं है. यह टिप्पणी, Firebase कंसोल में Hosting डैशबोर्ड पर डिप्लॉयमेंट से जुड़ी अन्य जानकारी के साथ दिखेगी. उदाहरण के लिए:

firebase deploy --only hosting -m "Deploying the best new feature ever."

डिप्लॉय करने से पहले और डिप्लॉय करने के बाद होने वाले टास्क जोड़ना

डिप्लॉय करने से पहले या बाद में होने वाले टास्क करने के लिए, firebase deploy कमांड से शेल स्क्रिप्ट को कनेक्ट किया जा सकता है. हालांकि, ऐसा करना ज़रूरी नहीं है. उदाहरण के लिए, postDeploy हुक, नई साइट पर लागू होने वाले कॉन्टेंट के एडमिन को सूचना दे सकता है. ज़्यादा जानकारी के लिए, Firebase सीएलआई दस्तावेज़ देखें.

डिप्लॉय किए गए कॉन्टेंट को कैश मेमोरी में सेव करना

स्टैटिक कॉन्टेंट के लिए अनुरोध किए जाने पर, Firebase Hosting कॉन्टेंट को सीडीएन पर अपने-आप कैश मेमोरी में सेव कर देता है. अगर साइट का कॉन्टेंट फिर से डिप्लॉय किया जाता है, तो Firebase, CDN पर कैश मेमोरी में सेव किया गया आपका सारा स्टैटिक कॉन्टेंट अपने-आप मिटा देता है. इससे नए अनुरोधों को आपका नया कॉन्टेंट मिलता है.

ध्यान दें कि डाइनैमिक कॉन्टेंट को कैश मेमोरी में सेव करने की सुविधा को कॉन्फ़िगर किया जा सकता है.

एचटीटीपीएस पर दिखाना

Firebase Hosting सिर्फ़ एसएसएल है. इसका मतलब है कि कॉन्टेंट सिर्फ़ एचटीटीपीएस पर दिखाया जाता है.

पक्का करें कि Firebase Hosting पर होस्ट न किए गए सभी एक्सटर्नल रिसॉर्स, एसएसएल (एचटीटीपीएस) के ज़रिए लोड किए जाएं. इनमें सभी एक्सटर्नल स्क्रिप्ट भी शामिल हैं. ज़्यादातर ब्राउज़र, उपयोगकर्ताओं को "मिले-जुले कॉन्टेंट" (एसएसएल और नॉन-एसएसएल ट्रैफ़िक) लोड करने की अनुमति नहीं देते.

फ़ाइलें मिटाना

Firebase Hosting में, डिप्लॉय की गई साइट से चुनी गई फ़ाइलों को मिटाने का मुख्य तरीका यह है कि फ़ाइलों को स्थानीय तौर पर मिटाएं और फिर उन्हें फिर से डिप्लॉय करें.

अगले चरण

• GitHub के साथ इंटिग्रेट करें और GitHub ऐक्शन सेट अप करके, झलक वाले कॉन्टेंट को दोहराएं.

• होस्ट करने से जुड़ी अन्य सुविधाओं के बारे में जानें:

  • होस्टिंग व्यवहार कॉन्फ़िगर करना
  • कस्टम डोमेन कनेक्ट करना
  • डाइनैमिक कॉन्टेंट उपलब्ध कराना और माइक्रोसर्विस होस्ट करना

• Firebase सीएलआई के पूरे दस्तावेज़ देखें.

• अपने ऐप्लिकेशन को लॉन्च करने के लिए तैयारी करना:

  • Google Cloud कंसोल में, अपने प्रोजेक्ट के लिए बजट से जुड़ी सूचनाएं सेट अप करें.
  • Firebase कंसोल में, इस्तेमाल और बिलिंग डैशबोर्ड पर नज़र रखें. इससे आपको Firebase की कई सेवाओं में, अपने प्रोजेक्ट के इस्तेमाल की पूरी जानकारी मिलेगी. इस्तेमाल से जुड़ी ज़्यादा जानकारी के लिए, Hosting इस्तेमाल डैशबोर्ड पर भी जाएं.
  • Firebase के लॉन्च की चेकलिस्ट देखें.