מילוי בקשות לתוכן דינמי ואירוח מיקרו-שירותים (microservices) באמצעות Cloud Functions

מתאימים את Cloud Functions ל-Firebase Hosting כדי ליצור ולהציג את התוכן הדינמי, או לפתח ממשקי API ל-REST כמיקרו-שירותים (microservices).

באמצעות Cloud Functions for Firebase תוכלו להריץ אוטומטית קוד בקצה העורפי בתגובה לבקשות HTTPS. הקוד מאוחסן בענן של Google ופועל בסביבה מנוהלת. אין צורך לנהל ולשנות את קנה המידה של השרתים שלכם.

תרחישים לדוגמה ודוגמאות ל-Cloud Functions בשילוב עם Firebase Hosting זמינים בסקירה הכללית שלנו בנושא שירותים ללא שרת.

חיבור Cloud Functions אל Firebase Hosting

בקטע הזה מוסבר איך לחבר פונקציה ל-Firebase Hosting.

שימו לב שכדי לשפר את הביצועים של הצגת תוכן דינמי, אפשר לכוונן את הגדרות המטמון (אופציונלי).

שלב 1: הגדרה של Cloud Functions

  1. מוודאים שמשתמשים בגרסה העדכנית של CLI של Firebase ושאתם מפעילים את Firebase Hosting.

    הוראות מפורטות להתקנת ה-CLI ולהפעלת Hosting מפורטות במדריך למתחילים בנושא Hosting.

  2. חשוב לוודא שהגדרתם את Cloud Functions:

    • אם כבר הגדרתם את Cloud Functions, אתם יכולים להמשיך לשלב 2: יצירה ובדיקה של פונקציית HTTPS.

    • אם לא הגדרתם את Cloud Functions:

      1. כדי לאתחל את Cloud Functions, מריצים את הפקודה הבאה מהרמה הבסיסית (root) של ספריית הפרויקט:

        firebase init functions
      2. כשמופיעה בקשה, בוחרים באפשרות JavaScript (ההדרכה המפורטת הזו משתמשת ב-JS).

      3. בודקים שיש ספרייה functions בספריית הפרויקט המקומית (שנוצרה על ידי הפקודה של Firebase שרציתם עכשיו). הספרייה functions היא המקום שבו נמצא הקוד של Cloud Functions.

שלב 2: יוצרים פונקציית HTTPS ובודקים אותה באתר Hosting

  1. פתיחת /functions/index.js בעורך המועדף עליך.

  2. מחליפים את תוכן הקובץ בקוד הבא.

    הקוד הזה יוצר פונקציית HTTPS (שנקראת bigben) שמשיבים לה בקשות HTTPS עם 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. ברמה הבסיסית (root) של ספריית הפרויקט המקומית, מריצים את הפקודה הבאה:

      firebase emulators:start
    2. ניגשים לפונקציה דרך כתובת ה-URL המקומית שמוחזרת על ידי ה-CLI, לדוגמה: http://localhost:5001/PROJECT_ID/us-central1/bigben.

מידע נוסף על בקשות HTTPS זמין במסמכי התיעוד של Cloud Functions.

בשלב הבא מוסבר איך לגשת לפונקציית ה-HTTPS מכתובת URL של Firebase Hosting, כדי שהיא תוכל ליצור תוכן דינמי לאתר שמתארח ב-Firebase.

שלב 3: מפנים בקשות HTTPS לפונקציה

בעזרת כללי כתיבה מחדש, אפשר להפנות בקשות שתואמות לדפוסים ספציפיים ליעד יחיד. בשלבים הבאים מוסבר איך להפנות את כל הבקשות מהנתיב ../bigben באתר Hosting כדי להפעיל את הפונקציה bigben.

  1. פותחים את קובץ ה-firebase.json.

  2. מוסיפים את ההגדרות הבאות של rewrite בקטע hosting:

    "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. נכנסים לכתובת ה-URL של האתר שמתארח באופן מקומי, כפי שהיא הוחזרה על ידי ה-CLI (בדרך כלל localhost:5000), אבל מוסיפים לכתובת ה-URL את הערך bigben, כך: http://localhost:5000/bigben

  4. בודקים את הפונקציה ואת הפונקציונליות שלה באתר. אפשר להשתמש באמולטורים של Firebase כדי לבדוק את הגרסאות האלה.

כדי להשיג את הביצועים הטובים ביותר, כדאי למקם את הפונקציות שלכם באותו מיקום גיאוגרפי עם Hosting. לשם כך, בוחרים באחת מהאזורים הבאים:

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

בדף ההגדרות של Hosting תוכלו לקרוא פרטים נוספים על כללי הכתיבה מחדש. תוכלו גם לקרוא על סדר העדיפויות של התשובות בהגדרות שונות של Hosting.

חשוב לזכור: כדי לשפר את הביצועים של הצגת תוכן דינמי, אפשר לשנות את הגדרות המטמון.

שלב 4: פורסים את הפונקציה

אחרי שהפונקציה פועלת כמצופה במהדורת האימולטור, אפשר להמשיך לפריסה, לבדיקה ולהפעלה שלה באמצעות משאבי הפרויקט האמיתיים. זהו זמן טוב להגדיר אפשרויות בסביבת זמן הריצה כדי לשלוט בהתנהגות ההתאמה לעומס של פונקציות שפועלות בסביבת הייצור.

  1. כדי לפרוס את הפונקציה, את התוכן ואת קובץ התצורה של Hosting באתר, מריצים את הפקודה הבאה משורשי ספריית הפרויקט המקומית:

    firebase deploy --only functions,hosting
  2. אפשר לגשת לאתר הפעיל ולפונקציה שלכם בכתובות ה-URL הבאות:

שימוש במסגרת אינטרנט

אפשר להשתמש במסגרות אינטרנט, כמו Express.js, ב-Cloud Functions כדי להציג את התוכן הדינמי של האפליקציה ולכתוב אפליקציות אינטרנט מורכבות בקלות רבה יותר.

בקטע הבא מפורטת דוגמה מפורטת לשימוש ב-Express.js עם Firebase Hosting ו-Cloud Functions.

  1. כדי להתקין את Express.js בפרויקט המקומי, מריצים את הפקודה הבאה מהספרייה functions:

    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. ונקודת קצה נוספת שתחזיר את הספירה של BONG כ-API, בפורמט JSON, ב-/api:

      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"
       } ]
     }
    }

הוספת שכבת middleware

בהמשך לדוגמה שלנו, עכשיו כשאתם משתמשים ב-Express.js, תוכלו להוסיף Middleware של Express.js בדרך הרגילה. לדוגמה, אפשר להפעיל בקשות CORS בנקודות הקצה שלנו.

  1. מריצים את הפקודה הבאה כדי להתקין את שכבת הביניים cors:

    npm install --save cors
  2. פותחים את הקובץ /functions/index.js ומוסיפים את cors לאפליקציית Express.js, באופן הבא:

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

במסמכי התיעוד של Cloud Functions תוכלו לקרוא מידע נוסף על שימוש ב-Firebase עם אפליקציות Express ומודולים של שכבת הביניים.

השלבים הבאים