קישור Firebase App Hosting לרשת VPC

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

הקצה העורפי של Firebase App Hosting יכול להתחבר לרשת ענן וירטואלי פרטי (VPC). כך תוכלו לתת לשרת הקצה העורפי של Firebase App Hosting גישה לשירותי קצה עורפי שלא ניתן לגשת אליהם באמצעות כתובות IP ציבוריות, כמו Cloud SQL,‏ Spanner,‏ Cloud Memorystore,‏ Compute Engine או מיקרו-שירותים פנימיים של Kubernetes.

הגישה ל-VPC זמינה רק בסביבת זמן הריצה (מהקונטיינר Cloud Run), ולא בזמן ה-build (Cloud Build).

הגדרה ב-apphosting.yaml

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

runConfig:
  vpcAccess:
    egress: PRIVATE_RANGES_ONLY # Default value
    networkInterfaces:
      # Specify at least one of network and/or subnetwork
      - network: my-network-id
        subnetwork: my-subnetwork-id

דוגמה: חיבור ל-Memorystore for Redis מאפליקציית Next.js

מערכות מטמון כמו Redis או Memcached משמשות בדרך כלל ליצירת שכבת מטמון נתונים מהירה לאפליקציה. בדוגמה הזו תלמדו איך להגדיר את Memorystore for Redis באותו פרויקט Google Cloud שבו נמצא הקצה העורפי Firebase App Hosting, ולהתחבר אליו באמצעות Direct VPC egress.

שלב 0: יצירת מכונה של Memorystore for Redis

1. נכנסים לדף Memorystore for Redis במסוף Google Cloud.
   • מוודאים שבחרתם באותו פרויקט שבו אתם משתמשים ב-Firebase App Hosting.
   • אם אין לכם גישה לדף הזה, ודאו שהחיוב מופעל בפרויקט ושהפעלתם את Memorystore API.
2. בוחרים באפשרות Create Instance.
3. מגדירים את המכונה החדשה עם ההגדרות המועדפות. ריכזנו כאן כמה ערכים לדוגמה שאפשר להשתמש בהם:
   • מזינים my-redis-cache בקטע Instance ID.
   • מזינים Redis cache בקטע Display name.
   • בוחרים באפשרות Basic מתחת לבורר הרמות. ברמה הבסיסית מוגדר צומת Redis עצמאי, בניגוד לרמה הרגילה שבה נעשה שימוש בצומת רפליקות לגיבוי הנתונים.
   • בבורר Region בוחרים את האזור של הקצה העורפי של App Hosting. חשוב להגדיר את הערך הזה כך שיתאים לאזור של הקצה העורפי.
   • בבורר האזורים, בוחרים any.
   • מזינים 5 בקטע Capacity. כך תגדירו את קיבולת המכונה ל-5GB.
   • בוחרים באפשרות 5.0 בקטע גרסה (מומלץ).
   • בבורר Authorized network בוחרים באפשרות default.

שלב 1: מעדכנים את apphosting.yaml במזהה הרשת של VPC

1. נכנסים לדף VPC networks במסוף Google Cloud.
2. מחפשים את מזהה הרשת של VPC במכונה של Memorystore for Redis (בדרך כלל זהו default).

3. מגדירים את תצורת תעבורת הנתונים היוצאת (egress) של VPC ישירות ב-apphosting.yaml באמצעות מזהה הרשת של VPC:

   runConfig:
     vpcAccess:
       egress: PRIVATE_RANGES_ONLY # Default value
     networkInterfaces:
       - network: my-network-id
   

שלב 2: מוסיפים משתני סביבה שמפנים את האפליקציה ל-Redis

1. פרטי החיבור (מארח ויציאה) מופיעים בכרטיסייה Connections (חיבורים) במסוף Google Cloud של מכונה של Memorystore for Redis.

2. מתחברים ל-Redis באמצעות משתני הסביבה REDISPORT ו-REDISHOST. מגדירים אותם ב-apphosting.yaml באמצעות ערכי המארח והיציאה מהמסוף Google Cloud:

   env:
     # Sample only. Use actual values provided by Memorystore
     - variable: REDISPORT
       value: 6379
     - variable: REDISHOST
       value: 10.127.16.3
   

שלב 3: שימוש ב-Redis מהאפליקציה

1. מתקינים את חבילת ה-npm‏ redis:

   npm install redis@latest

2. גישה למטמון Redis מהקוד. משתמשים במשתני הסביבה שהוגדרו בשלב הקודם. לדוגמה, כך אפשר לקרוא ממטמון במטפל מסלול ב-Next.js:

   • src/lib/redis.js

     import { createClient } from "redis";
     
     // Set these environment variables in apphosting.yaml
     const REDISHOST = process.env.REDISHOST;
     const REDISPORT = process.env.REDISPORT;
     
     let redisClient;
     
     export async function getClient(req, res) {
       // Only connect if a connection isn't already available
       if (!redisClient) {
         redisClient = await createClient(REDISPORT, REDISHOST)
           .on("error", (err) => console.error("Redis Client Error", err))
           .connect();
       }
     
       return redisClient;
     }
     

   • src/app/counter/route.js

     import { getClient } from "@/lib/redis.js";
     
     export async function GET(request) {
       const redisClient = await getClient();
       const count = await redisClient.get("counter");
     
       return Response.json({ count });
     }
     
     export async function POST(request) {
       const redisClient = await getClient();
       const count = await redisClient.incr("counter");
     
       return Response.json({ count });
     }
     

שלב 4 (אופציונלי): מגדירים את האפליקציה לפיתוח מקומי

אפשר לשנות את הערכים באמצעות apphosting.emulator.yaml במהלך ההרצה של המהדר Firebase App Hosting. כאן אפשר לשנות את הערך של REDISHOST כך שיצביע על localhost, כדי שתוכלו לפתח באופן מקומי באמצעות התקנה מקומית של Redis.

1. התקנת Redis במחשב המקומי

2. יוצרים או עורכים את apphosting.emulators.yaml כדי להפנות למכונה המקומית:

   env:
     - variable: REDISHOST
       value: 127.0.0.1