เชื่อมต่อโฮสติ้งแอป Firebase กับเครือข่าย VPC

แบ็กเอนด์ Firebase App Hosting เชื่อมต่อกับเครือข่าย Virtual Private Cloud (VPC) ได้ ซึ่งจะช่วยให้แบ็กเอนด์Firebase App Hostingเข้าถึงบริการแบ็กเอนด์ที่เข้าถึงไม่ได้โดยใช้ที่อยู่ IP สาธารณะ เช่น Cloud SQL, Spanner, Cloud MemorystoreCompute Engine หรือไมโครเซอร์วิสภายในของ Kubernetes

การเข้าถึง VPC จะพร้อมใช้งานเมื่อรันไทม์เท่านั้น (จากCloud Runตู้คอนเทนเนอร์) ไม่ใช่เมื่อสร้าง (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 สำหรับ Redis จากแอป Next.js

ระบบแคช เช่น Redis หรือ Memcached มักใช้ในการสร้างเลเยอร์การแคชข้อมูลที่รวดเร็วสําหรับแอป ตัวอย่างนี้แสดงวิธีตั้งค่า Memorystore สําหรับ Redis ในโปรเจ็กต์ Google Cloud เดียวกันกับแบ็กเอนด์ Firebase App Hosting และเชื่อมต่อกับ Direct VPC Egress

ขั้นตอนที่ 0: สร้างอินสแตนซ์ Memorystore for Redis

หมายเหตุ: ระบบอาจแจ้งให้คุณสร้างนโยบายการเชื่อมต่อบริการเป็นส่วนหนึ่งของการตั้งค่านี้ด้วย

1. ไปที่หน้าMemorystore สำหรับ Redis ในคอนโซล Google Cloud
   • ตรวจสอบว่าได้เลือกโปรเจ็กต์เดียวกับที่ใช้สำหรับ Firebase App Hosting แล้ว
   • หากเข้าถึงหน้านี้ไม่ได้ ให้ตรวจสอบว่าได้เปิดใช้การเรียกเก็บเงินสําหรับโปรเจ็กต์และเปิดใช้ Memorystore API แล้ว
2. เลือกสร้างอินสแตนซ์
3. กำหนดค่าอินสแตนซ์ใหม่ด้วยการตั้งค่าที่ต้องการ ตัวอย่างค่าที่คุณใช้ได้มีดังนี้
   • ป้อน my-redis-cache ในส่วน Instance ID
   • ป้อน Redis cache ในส่วนชื่อที่แสดง
   • เลือกพื้นฐานในส่วนตัวเลือกระดับ ระดับพื้นฐานจะกำหนดโหนด Redis แบบสแตนด์อโลน ซึ่งต่างจากระดับมาตรฐานที่ใช้โหนดสําเนาเพื่อสํารองข้อมูล
   • เลือกภูมิภาคของแบ็กเอนด์ App Hosting จากตัวเลือกภูมิภาค อย่าลืมตั้งค่านี้ให้ตรงกับภูมิภาคของแบ็กเอนด์
   • เลือกใดก็ได้จากตัวเลือกโซน
   • ป้อน 5 ในส่วนความจุ ซึ่งจะตั้งค่าความจุของอินสแตนซ์เป็น 5 GB
   • เลือก 5.0 ในส่วนเวอร์ชัน (แนะนำ)
   • เลือกค่าเริ่มต้นจากตัวเลือกเครือข่ายที่ได้รับอนุญาต

ขั้นตอนที่ 1: อัปเดต apphosting.yaml ด้วยรหัสเครือข่าย VPC

1. ไปที่หน้าเครือข่าย VPC ในคอนโซล Google Cloud
2. ค้นหารหัสเครือข่าย VPC สำหรับอินสแตนซ์ Memorystore สำหรับ Redis (มักจะเป็น default)

3. กำหนดค่าข้อมูลขาออกของ VPC โดยตรงใน apphosting.yaml โดยใช้รหัสเครือข่าย VPC ดังนี้

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

ขั้นตอนที่ 2: เพิ่มตัวแปรสภาพแวดล้อมที่นําแอปไปยัง Redis

1. ค้นหาข้อมูลการเชื่อมต่อ (โฮสต์และพอร์ต) ในแท็บ "การเชื่อมต่อ" ของอินสแตนซ์ Google Cloud

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 (ไม่บังคับ): กำหนดค่าแอปสําหรับการพัฒนาในเครื่อง

Firebase App HostingEmulator สามารถลบล้างค่าได้โดยใช้ apphosting.emulator.yaml ในส่วนนี้ คุณสามารถเปลี่ยนค่าของ REDISHOST ให้ชี้ไปยัง localhost เพื่อให้คุณพัฒนาแอปในเครื่องได้โดยใช้การติดตั้ง Redis ในเครื่อง

1. ติดตั้ง Redis ในเครื่องของคุณ

2. สร้างหรือแก้ไข apphosting.emulators.yaml เพื่ออ้างอิงอินสแตนซ์ในเครื่อง

   env:
     - variable: REDISHOST
       value: 127.0.0.1