אפשר להתאים בין Cloud Functions ל-Firebase Hosting כדי ליצור תוכן דינמי ולהציג אותו, או כדי ליצור ממשקי API ל-REST כמיקרו-שירותים.
Cloud Functions for Firebase מאפשר להריץ באופן אוטומטי קוד לקצה העורפי בתגובה לבקשות HTTPS. הקוד מאוחסן בענן של Google ופועל בסביבה מנוהלת. אין צורך לנהל ולשנות את קנה המידה של השרתים שלכם.
תרחישים לדוגמה ודוגמאות ל-Cloud Functions בשילוב עם Firebase Hosting זמינים בסקירה הכללית שלנו בנושא שירותים ללא שרת.
חיבור Cloud Functions אל Firebase Hosting
בקטע הזה מוסבר איך לחבר פונקציה ל-Firebase Hosting.
חשוב לזכור: כדי לשפר את הביצועים של הצגת תוכן דינמי, אפשר לשנות את הגדרות המטמון.
שלב 1: מגדירים את Cloud Functions
מוודאים שמשתמשים בגרסה העדכנית של CLI של Firebase ושאתם מפעילים את Firebase Hosting.
הוראות מפורטות להתקנת ה-CLI ולהפעלת Hosting מפורטות במדריך למתחילים בנושא Hosting.
ודאו שהגדרתם את Cloud Functions:
אם כבר הגדרתם את Cloud Functions, תוכלו להמשיך אל שלב 2: יצירת בדיקה של פונקציית HTTPS.
אם לא הגדרתם את Cloud Functions:
מאתחלים את Cloud Functions על ידי הפעלת הפקודה הבאה בתיקיית השורש של הפרויקט:
firebase init functions
כשמופיעה בקשה, בוחרים באפשרות JavaScript (בדוגמה הזו נעשה שימוש ב-JS).
בודקים שיש ספרייה
functions
בספריית הפרויקט המקומית (שנוצרה על ידי הפקודה של Firebase שרציתם עכשיו). הספרייהfunctions
היא המקום שבו נמצא הקוד של Cloud Functions.
שלב 2: יוצרים פונקציית HTTPS ובודקים אותה באתר Hosting
פותחים את
/functions/index.js
בכלי העריכה המועדף.מחליפים את תוכן הקובץ בקוד הבא.
הקוד הזה יוצר פונקציית 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>`); });
בודקים את הפונקציות באופן מקומי באמצעות Firebase Local Emulator Suite.
מריצים את הפקודה הבאה מהשורש של ספריית הפרויקט המקומית:
firebase emulators:start
ניגשים לפונקציה דרך כתובת ה-URL המקומית שמוחזרת על ידי ה-CLI, לדוגמה:
.http://localhost:5001/PROJECT_ID/us-central1/bigben
מידע נוסף על בקשות HTTPS זמין במסמכי התיעוד של Cloud Functions.
בשלב הבא נסביר איך לגשת לפונקציית ה-HTTPS הזו מכתובת URL מסוג Firebase Hosting כדי שתוכל ליצור תוכן דינמי לאתר שמתארח ב-Firebase.
שלב 3: מפנים בקשות HTTPS לפונקציה
בעזרת כללי כתיבה מחדש, אפשר להפנות בקשות שתואמות לדפוסים ספציפיים ליעד יחיד. השלבים הבאים מראים איך להפנות את כל הבקשות מהנתיב ../bigben
באתר Hosting כדי להריץ את הפונקציה bigben
.
פותחים את קובץ ה-
firebase.json
.מוסיפים את הגדרת
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) } } ] }
כדי לוודא שההפניה האוטומטית פועלת כצפוי, צריך לבדוק אותה שוב באמצעות המהדמנים של Firebase.
מריצים את הפקודה הבאה מהשורש של ספריית הפרויקט המקומי:
firebase emulators:start
נכנסים לכתובת ה-URL של האתר שמתארח באופן מקומי, כפי שהיא הוחזרה על ידי ה-CLI (בדרך כלל
localhost:5000
), אבל מוסיפים לכתובת ה-URL את הערךbigben
, כך:http://localhost:5000/bigben
בודקים את הפונקציה ואת הפונקציונליות שלה באתר. אפשר להשתמש באמולטורים של Firebase כדי לבדוק את הגרסאות האלה.
כדי להשיג את הביצועים הטובים ביותר, כדאי למקם את הפונקציות שלכם באותו מיקום גיאוגרפי עם Hosting. לשם כך, בוחרים באחת מהאזורים הבאים:
us-west1
us-central1
us-east1
europe-west1
asia-east1
בדף ההגדרה Hosting תוכלו לקרוא פרטים נוספים על כללי הכתיבה מחדש. תוכלו גם לקרוא על סדר העדיפויות של התשובות בהגדרות שונות של Hosting.
חשוב לזכור: כדי לשפר את הביצועים של הצגת תוכן דינמי, אפשר לשנות את הגדרות המטמון.
שלב 4: פורסים את הפונקציה
אחרי שהפונקציה פועלת כמצופה במהדורת האימולטור, אפשר להמשיך לפריסה, לבדיקה ולהפעלה שלה באמצעות משאבי הפרויקט האמיתיים. זהו זמן טוב להגדיר אפשרויות בסביבת זמן הריצה כדי לשלוט בהתנהגות ההתאמה לעומס של פונקציות שפועלות בסביבת הייצור.
כדי לפרוס את הפונקציה, את התוכן ואת קובץ התצורה של Hosting באתר, מריצים את הפקודה הבאה משורשי ספריית הפרויקט המקומית:
firebase deploy --only functions,hosting
אפשר לגשת לאתר ולפונקציה שלכם בגרסה הפעילה בכתובות ה-URL הבאות:
תת-הדומיינים של Firebase:
PROJECT_ID.web.app/bigben
וגםPROJECT_ID.firebaseapp.com/bigben
כל הדומיינים המותאמים אישית שמחוברים:
CUSTOM_DOMAIN/bigben
שימוש במסגרת אינטרנט
אפשר להשתמש במסגרות אינטרנט, כמו Express.js, ב-Cloud Functions כדי להציג את התוכן הדינמי של האפליקציה ולכתוב אפליקציות אינטרנט מורכבות בקלות רבה יותר.
בקטע הבא מופיעה דוגמה מפורטת לשימוש ב-Express.js עם Firebase Hosting ו-Cloud Functions.
כדי להתקין את Express.js בפרויקט המקומי, מריצים את הפקודה הבאה מהספרייה
functions
:npm install express --save
פותחים את הקובץ
/functions/index.js
, מייבאים את Express.js ומפעילים אותו:const functions = require('firebase-functions/v1'); const express = require('express'); const app = express();
מוסיפים את שתי נקודות הקצה הבאות:
מוסיפים את נקודת הקצה הראשונה כדי להציג את האינדקס של האתר שלנו בכתובת
/
.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>`); });
וגם נקודת קצה נוספת להחזרת ספירת
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)}); });
מייצאים את אפליקציית Express.js כפונקציית HTTPS:
exports.app = functions.https.onRequest(app);
בקובץ
firebase.json
, מפנים את כל הבקשות לפונקציהapp
. הכתיבה מחדש מאפשרת ל-Express.js להציג את נתיב המשנה השונה שהגדרתם (בדוגמאות האלה,/
ו-/api
).{ "hosting": { // ... // Add the "rewrites" attribute within "hosting" "rewrites": [ { "source": "**", "function": "app" } ] } }
הוספת שכבת middleware
בהמשך לדוגמה שלנו, עכשיו כשאתם משתמשים ב-Express.js, תוכלו להוסיף Middleware של Express.js בדרך הרגילה. לדוגמה, אפשר להפעיל בקשות CORS בנקודות הקצה שלנו.
מריצים את הפקודה הבאה כדי להתקין את שכבת הביניים
cors
:npm install --save cors
פותחים את הקובץ
/functions/index.js
ומוסיפים אתcors
לאפליקציית Express.js, כך:const cors = require('cors')({origin: true}); app.use(cors);
במסמכי התיעוד של Cloud Functions תוכלו לקרוא מידע נוסף על שימוש ב-Firebase עם אפליקציות Express ומודולים של שכבת הביניים.
השלבים הבאים
הגדרת שמירת תוכן במטמון של התוכן הדינמי שלכם ב-CDN גלובלי.
אינטראקציה עם שירותים אחרים של Firebase באמצעות Firebase Admin SDK.
המחירון והמכסות והמגבלות של Cloud Functions