Catch up on everything announced at Firebase Summit, and learn how Firebase can help you accelerate app development and run your app with confidence. Learn More

क्लाउड फ़ंक्शंस के साथ गतिशील सामग्री परोसें और माइक्रोसर्विसेज होस्ट करें

संग्रह की मदद से व्यवस्थित रहें अपनी प्राथमिकताओं के आधार पर, कॉन्टेंट को सेव करें और कैटगरी में बांटें.

अपनी गतिशील सामग्री उत्पन्न करने और सेवा देने या माइक्रोसर्विसेज के रूप में REST API बनाने के लिए Firebase होस्टिंग के साथ क्लाउड फ़ंक्शंस को जोड़ें।

फायरबेस के लिए क्लाउड फ़ंक्शंस आपको HTTPS अनुरोधों के जवाब में स्वचालित रूप से बैकएंड कोड चलाने देता है। आपका कोड Google के क्लाउड में संगृहीत है और एक प्रबंधित परिवेश में चलता है। अपने स्वयं के सर्वर को प्रबंधित और स्केल करने की कोई आवश्यकता नहीं है।

उदाहरण के लिए फायरबेस होस्टिंग के साथ एकीकृत क्लाउड फ़ंक्शंस के मामलों और नमूनों का उपयोग करें, हमारे सर्वर रहित अवलोकन पर जाएं।

क्लाउड फ़ंक्शंस को फायरबेस होस्टिंग से कनेक्ट करें

यह अनुभाग किसी फ़ंक्शन को Firebase होस्टिंग से कनेक्ट करने के लिए एक वॉक-थ्रू उदाहरण प्रदान करता है।

ध्यान दें कि गतिशील सामग्री परोसने के प्रदर्शन को बेहतर बनाने के लिए, आप वैकल्पिक रूप से अपनी कैश सेटिंग्स को ट्यून कर सकते हैं।

चरण 1: क्लाउड फ़ंक्शंस सेट करें

  1. सुनिश्चित करें कि आपके पास फायरबेस सीएलआई का नवीनतम संस्करण है और आपने फायरबेस होस्टिंग को इनिशियलाइज़ किया है।

    सीएलआई स्थापित करने और होस्टिंग आरंभ करने के बारे में विस्तृत निर्देशों के लिए, होस्टिंग के लिए आरंभ करें मार्गदर्शिका देखें।

  2. सुनिश्चित करें कि आपने क्लाउड फ़ंक्शंस सेट अप किया है:

    • यदि आप पहले से ही क्लाउड फ़ंक्शंस सेट कर चुके हैं, तो आप चरण 2 पर आगे बढ़ सकते हैं: एक HTTPS फ़ंक्शन बनाएं और उसका परीक्षण करें

    • यदि आपने क्लाउड फ़ंक्शंस सेट नहीं किया है:

      1. अपनी प्रोजेक्ट निर्देशिका के मूल से निम्न आदेश चलाकर क्लाउड फ़ंक्शंस प्रारंभ करें:

        firebase init functions
      2. संकेत दिए जाने पर, JavaScript चुनें (यह वॉक-थ्रू उदाहरण JS का उपयोग करता है)।

      3. जांचें कि आपकी स्थानीय प्रोजेक्ट निर्देशिका में एक functions निर्देशिका है (Firebase कमांड द्वारा बनाई गई जिसे आपने अभी चलाया था)। यह functions निर्देशिका वह जगह है जहां क्लाउड फ़ंक्शंस के लिए कोड रहता है।

चरण 2: अपनी होस्टिंग साइट के लिए एक HTTPS फ़ंक्शन बनाएं और उसका परीक्षण करें

  1. अपने पसंदीदा संपादक में /functions/index.js खोलें।

  2. फ़ाइल की सामग्री को निम्न कोड से बदलें।

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

    const functions = require('firebase-functions');
    
    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. फायरबेस लोकल एमुलेटर सूट का उपयोग करके स्थानीय रूप से अपने कार्यों का परीक्षण करें।

    1. अपनी स्थानीय परियोजना निर्देशिका की जड़ से, निम्न आदेश चलाएँ:

      firebase emulators:start
    2. सीएलआई द्वारा लौटाए गए स्थानीय यूआरएल के माध्यम से फ़ंक्शन तक पहुंचें, उदाहरण के लिए: http://localhost:5001/ PROJECT_ID /us-central1/bigben

HTTPS अनुरोधों के बारे में अधिक जानने के लिए Cloud Functions के दस्तावेज़ देखें।

अगला चरण आपको बताएगा कि इस HTTPS फ़ंक्शन को Firebase होस्टिंग URL से कैसे एक्सेस किया जाए ताकि यह आपकी Firebase-होस्टेड साइट के लिए गतिशील सामग्री उत्पन्न कर सके।

चरण 3: सीधे HTTPS अनुरोध आपके फ़ंक्शन के लिए

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

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

  2. hosting अनुभाग के अंतर्गत निम्नलिखित rewrite विन्यास जोड़ें:

    "hosting": {
      // ...
    
      // Add the "rewrites" attribute within "hosting"
      "rewrites": [ {
        "source": "/bigben",
        "function": "bigben",
        "region": "us-central1"  // optional (see note below)
      } ]
    }
    
  3. पुष्टि करें कि आपका रीडायरेक्ट फ़ायरबेस एमुलेटर के साथ फिर से परीक्षण करके अपेक्षित रूप से काम करता है।

    1. अपनी स्थानीय परियोजना निर्देशिका की जड़ से, निम्न आदेश चलाएँ:

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

  4. अपनी साइट के लिए अपने कार्य और इसकी कार्यक्षमता पर पुनरावृति करें। इन पुनरावृत्तियों का परीक्षण करने के लिए फायरबेस अनुकरणकर्ताओं का प्रयोग करें।

नियमों को फिर से लिखने के बारे में अधिक जानकारी के लिए होस्टिंग कॉन्फ़िगरेशन पृष्ठ पर जाएं। आप विभिन्न होस्टिंग कॉन्फ़िगरेशन के लिए प्रतिक्रियाओं के प्राथमिकता क्रम के बारे में भी जान सकते हैं।

ध्यान दें कि गतिशील सामग्री परोसने के प्रदर्शन को बेहतर बनाने के लिए, आप वैकल्पिक रूप से अपनी कैश सेटिंग्स को ट्यून कर सकते हैं।

चरण 4: अपना कार्य परिनियोजित करें

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

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

    firebase deploy --only functions,hosting
  2. निम्नलिखित URL पर अपनी लाइव साइट और अपने कार्य को एक्सेस करें:

    • आपके Firebase उप डोमेन:
      PROJECT_ID .web.app/bigben और PROJECT_ID .firebaseapp.com/bigben

    • कोई भी जुड़ा हुआ कस्टम डोमेन :
      CUSTOM_DOMAIN /bigben

एक वेब ढांचे का प्रयोग करें

आप अपने ऐप्लिकेशन की गतिशील सामग्री दिखाने और जटिल वेब ऐप्लिकेशन को अधिक आसानी से लिखने के लिए Cloud Functions में Express.js जैसे वेब फ़्रेमवर्क का उपयोग कर सकते हैं.

निम्न अनुभाग Firebase होस्टिंग और क्लाउड फ़ंक्शंस के साथ Express.js का उपयोग करने के लिए एक वॉक-थ्रू उदाहरण प्रदान करता है।

  1. अपने functions निर्देशिका से निम्न आदेश चलाकर अपने स्थानीय प्रोजेक्ट में Express.js स्थापित करें:

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

    const functions = require('firebase-functions');
    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. और JSON प्रारूप में, /api के तहत, एक एपीआई के रूप में 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 ऐप को HTTPS फ़ंक्शन के रूप में निर्यात करें:

    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);
    

एक्सप्रेस ऐप्स और मिडलवेयर मॉड्यूल के साथ फायरबेस का उपयोग करने के बारे में अधिक जानने के लिए क्लाउड फ़ंक्शंस दस्तावेज़ीकरण पर जाएं।

अगले कदम