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

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

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

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

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

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

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

अगर आपको जल्दी-जल्दी बदलाव करने हैं या आपको अपने ऐप्लिकेशन को, एम्युलेट किए गए बैकएंड प्रोजेक्ट के संसाधनों के साथ इंटरैक्ट करना है, तो 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 आपके वेब ऐप्लिकेशन को "प्रीव्यू यूआरएल" पर दिखाता है. यह एक शेयर किया जा सकने वाला, अस्थायी यूआरएल होता है. झलक वाले यूआरएल का इस्तेमाल करने पर, आपका वेब ऐप्लिकेशन सभी प्रोजेक्ट संसाधनों के लिए, आपके असली बैकएंड से इंटरैक्ट करता है. हालांकि, फिर से लिखने की कॉन्फ़िगरेशन में"पिन की गई" फ़ंक्शन को छोड़कर.

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

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

    firebase hosting:channel:deploy CHANNEL_ID

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

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

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

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

Firebase Hosting में GitHub Action की सुविधा काम करती है. इसकी मदद से, पुल अनुरोध में बदलाव करने पर, झलक दिखाने वाले यूआरएल अपने-आप बन जाते हैं और अपडेट हो जाते हैं. इस 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

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

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

ऊपर दिए गए दोनों विकल्पों से, आपका 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 कमांड से शेल स्क्रिप्ट को कनेक्ट किया जा सकता है. हालांकि, यह ज़रूरी नहीं है. इससे डिप्लॉयमेंट से पहले या बाद में टास्क पूरे किए जा सकते हैं. उदाहरण के लिए, पोस्टडिप्लॉय हुक, साइट के नए कॉन्टेंट को डिप्लॉय करने के बारे में एडमिन को सूचना दे सकता है. ज़्यादा जानकारी के लिए, Firebase सीएलआई दस्तावेज़ देखें.

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

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

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

एचटीटीपीएस पर कॉन्टेंट दिखाना

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

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

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

अगले चरण