Cloud Functions की मदद से डाइनैमिक कॉन्टेंट उपलब्ध कराएं और माइक्रोसर्विस होस्ट करें

Cloud Functions को Firebase Hosting के साथ जोड़कर, डाइनैमिक कॉन्टेंट जनरेट और सर्व करें. इसके अलावा, REST एपीआई को माइक्रोसेवाओं के तौर पर बनाएं.

Cloud Functions for Firebase की मदद से, एचटीटीपीएस अनुरोधों के जवाब में, बैकएंड कोड अपने-आप चलाया जा सकता है. आपका कोड, Google के क्लाउड में सेव होता है और मैनेज किए गए एनवायरमेंट में चलता है. आपको अपने सर्वर मैनेज और स्केल करने की ज़रूरत नहीं होती.

के इस्तेमाल के उदाहरण और सैंपल देखने के लिए, Cloud Functions के साथ इंटिग्रेट किए गए Firebase Hosting की खास जानकारी देखें.सर्वरलेस

Cloud Functions को Firebase Hosting से कनेक्ट करना

इस सेक्शन में, किसी फ़ंक्शन को Firebase Hosting से कनेक्ट करने का उदाहरण दिया गया है.

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

पहला चरण: सेट अप करना Cloud Functions

  1. पक्का करें कि आपके पास Firebase CLI का सबसे नया वर्शन हो और आपने Firebase Hosting को शुरू कर लिया हो.

    CLI इंस्टॉल करने और Hostingको शुरू करने के बारे में ज़्यादा जानकारी के लिए, शुरुआती निर्देश देखें Hosting.

  2. पक्का करें कि आपने Cloud Functions सेट अप कर लिया हो:

    • अगर आपने पहले से Cloud Functions सेट अप कर लिया है, तो दूसरे चरण पर जाएं: एचटीटीपीएस फ़ंक्शन बनाना और उसकी जांच करना.

    • अगर आपने सेट अप नहीं किया है, तो Cloud Functions:

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

        firebase init functions
      2. प्रॉम्प्ट मिलने पर, JavaScript चुनें. इस उदाहरण में JS का इस्तेमाल किया गया है.

      3. देखें कि आपकी लोकल प्रोजेक्ट डायरेक्ट्री में functions डायरेक्ट्री मौजूद है या नहीं. यह डायरेक्ट्री, Firebase के उस निर्देश से बनती है जिसे आपने अभी चलाया है. यह functions डायरेक्ट्री है जहाँ Cloud Functions का कोड सेव होता है.

दूसरा चरण: अपनी Hosting साइट के लिए एचटीटीपीएस फ़ंक्शन बनाना और उसकी जांच करना

  1. अपने पसंदीदा एडिटर में /functions/index.js खोलें.

  2. फ़ाइल के कॉन्टेंट को इस कोड से बदलें.

    इस कोड से एक एचटीटीपीएस फ़ंक्शन (bigben नाम का) बनता है. यह फ़ंक्शन, एचटीटीपीएस अनुरोधों के जवाब में, हर घंटे के लिए BONG दिखाता है. यह ठीक घड़ी की तरह काम करता है.

    const functions = require('firebase-functions/v1');
    
    exports.bigben = functions.https.onRequest((req, res) => {
      const hours = (new Date().getHours() % 12) + 1  // London is UTC + 1hr;
      res.status(200).send(`<!doctype html>
        <head>
          <title>Time</title>
        </head>
        <body>
          ${'BONG '.repeat(hours)}
        </body>
      </html>`);
    });
    
  3. अपने फ़ंक्शन की स्थानीय तौर पर जांच करने के लिए, Firebase Local Emulator Suite का इस्तेमाल करें.

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

      firebase emulators:start
    2. CLI से मिले स्थानीय यूआरएल के ज़रिए, फ़ंक्शन को ऐक्सेस करें. उदाहरण के लिए: उदाहरण के लिए: http://localhost:5001/PROJECT_ID/us-central1/bigben.

एचटीटीपीएस अनुरोधों के बारे में ज़्यादा जानने के लिए, Cloud Functions दस्तावेज़ देखें.

अगले चरण में, आपको इस एचटीटीपीएस फ़ंक्शन को from a Firebase Hosting URL से ऐक्सेस करने का तरीका बताया जाएगा, ताकि यह Firebase पर होस्ट की गई आपकी साइट के लिए डाइनैमिक कॉन्टेंट जनरेट कर सके.

तीसरा चरण: एचटीटीपीएस अनुरोधों को अपने फ़ंक्शन पर रीडायरेक्ट करना

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

  1. अपनी firebase.json फ़ाइल खोलें.

  2. hosting सेक्शन में, यह rewrite कॉन्फ़िगरेशन जोड़ें:

    "hosting": {
      // ...
    
      // Add the "rewrites" attribute within "hosting"
      "rewrites": [ {
        "source": "/bigben",
        "function": {
          "functionId": "bigben",
          "region": "us-central1"  // optional (see note below)
          "pinTag": true           // optional (see note below)
        }
      } ]
    }
    
  3. Firebase एम्युलेटर की मदद से दोबारा जांच करके पुष्टि करें कि आपका रीडायरेक्ट उम्मीद के मुताबिक काम कर रहा है.

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

      firebase emulators:start
    2. CLI से मिले, अपनी साइट के स्थानीय तौर पर होस्ट किए गए यूआरएल (आम तौर पर localhost:5000) पर जाएं. हालांकि, यूआरएल में bigben जोड़ें. जैसे: http://localhost:5000/bigben

  4. अपनी साइट के लिए, अपने फ़ंक्शन और उसकी सुविधाओं को बेहतर बनाएं. इन बदलावों की जांच करने के लिए, Firebase एम्युलेटर का इस्तेमाल करें.

बेहतर परफ़ॉर्मेंस के लिए, अपने फ़ंक्शन को Hosting के साथ कोलोकेट करें. इसके लिए, इनमें से कोई एक इलाका चुनें:

  • us-west1
  • us-central1
  • us-east1
  • europe-west1
  • asia-east1

रीराइट के नियमों के बारे में ज़्यादा जानकारी के लिए, Hosting कॉन्फ़िगरेशन पेज देखें . इसके अलावा, अलग-अलग Hosting कॉन्फ़िगरेशन के लिए, जवाबों की प्राथमिकता के क्रम के बारे में भी जानें.

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

चौथा चरण: अपना फ़ंक्शन डिप्लॉय करना

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

  1. अपनी लोकल प्रोजेक्ट डायरेक्ट्री के रूट से, यह निर्देश चलाकर अपने फ़ंक्शन के साथ-साथ, अपने साइट पर अपने Hosting कॉन्टेंट और कॉन्फ़िगरेशन को डिप्लॉय करें:

    firebase deploy --only functions,hosting
  2. अपनी लाइव साइट और फ़ंक्शन को इन यूआरएल पर ऐक्सेस करें:

    • Firebase के सबडोमेन:
      PROJECT_ID.web.app/bigben और PROJECT_ID.firebaseapp.com/bigben

    • कनेक्ट किए गए कोई भी कस्टम डोमेन:
      CUSTOM_DOMAIN/bigben

वेब फ़्रेमवर्क का इस्तेमाल करना

Cloud Functions में, Express.js जैसे वेब फ़्रेमवर्क का इस्तेमाल करके, अपने ऐप्लिकेशन के डाइनैमिक कॉन्टेंट को सर्व किया जा सकता है. साथ ही, जटिल वेब ऐप्लिकेशन को ज़्यादा आसानी से लिखा जा सकता है.Cloud Functions

इस सेक्शन में, Firebase Hosting और Cloud Functions के साथ Express.js का इस्तेमाल करने का उदाहरण दिया गया है.

  1. अपनी functions डायरेक्ट्री से, यह कमांड चलाकर अपने लोकल प्रोजेक्ट में Express.js इंस्टॉल करें:

    npm install express --save
  2. अपनी /functions/index.js फ़ाइल खोलें. इसके बाद, Express.js को इंपोर्ट और शुरू करें:

    const functions = require('firebase-functions/v1');
    const express = require('express');
    const app = express();
  3. ये दो एंडपॉइंट जोड़ें:

    1. अपनी वेबसाइट के इंडेक्स को / पर सर्व करने के लिए, पहला एंडपॉइंट जोड़ें.

      app.get('/', (req, res) => {
        const date = new Date();
        const hours = (date.getHours() % 12) + 1;  // London is UTC + 1hr;
        res.send(`
          <!doctype html>
          <head>
            <title>Time</title>
            <link rel="stylesheet" href="/style.css">
            <script src="/script.js"></script>
          </head>
          <body>
            <p>In London, the clock strikes:
              <span id="bongs">${'BONG '.repeat(hours)}</span></p>
            <button onClick="refresh(this)">Refresh</button>
          </body>
        </html>`);
      });
      
    2. /api में, JSON फ़ॉर्मैट में BONG की संख्या को एपीआई के तौर पर दिखाने के लिए, दूसरा एंडपॉइंट जोड़ें:

      app.get('/api', (req, res) => {
        const date = new Date();
        const hours = (date.getHours() % 12) + 1;  // London is UTC + 1hr;
        res.json({bongs: 'BONG '.repeat(hours)});
      });
      
  4. Express.js ऐप्लिकेशन को एचटीटीपीएस फ़ंक्शन के तौर पर एक्सपोर्ट करें:

    exports.app = functions.https.onRequest(app);
  5. अपनी firebase.json फ़ाइल में, सभी अनुरोधों को app फ़ंक्शन पर रीडायरेक्ट करें. इस रीराइट की मदद से, Express.js उस अलग सबपाथ को सर्व कर सकता है जिसे हमने कॉन्फ़िगर किया है. इस उदाहरण में, / और /api.

    {
     "hosting": {
       // ...
    
       // Add the "rewrites" attribute within "hosting"
       "rewrites": [ {
         "source": "**",
         "function": "app"
       } ]
     }
    }

मिडलवेयर जोड़ना

अपने उदाहरण को जारी रखते हुए, अब Express.js का इस्तेमाल किया जा रहा है. इसलिए, Express.js मिडलवेयर को सामान्य तरीके से जोड़ा जा सकता है. उदाहरण के लिए, हमारे एंडपॉइंट पर CORS अनुरोधों को चालू किया जा सकता है.

  1. cors मिडलवेयर इंस्टॉल करने के लिए, यह कमांड चलाएं:

    npm install --save cors
  2. अपनी /functions/index.js फ़ाइल खोलें. इसके बाद, अपने Express.js ऐप्लिकेशन में cors जोड़ें. जैसे:

    const cors = require('cors')({origin: true});
    app.use(cors);

Express ऐप्लिकेशन और मिडलवेयर मॉड्यूल के साथ Firebase का इस्तेमाल करने के बारे में ज़्यादा जानने के लिए, Cloud Functions दस्तावेज़ देखें.

अगले चरण