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

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

การเข้าถึง VPC จะใช้ได้ในรันไทม์ (จากCloud Run คอนเทนเนอร์) เท่านั้น ไม่ใช่ในเวลาบิลด์ (Cloud Build)

เลือกวิธีเชื่อมต่อกับเครือข่าย VPC

  • การออกผ่าน VPC โดยตรง: ง่ายขึ้น เร็วขึ้น และถูกลง ใช้ที่อยู่ IP 1 รายการต่อคอนเทนเนอร์ แนะนำสำหรับกรณีการใช้งานส่วนใหญ่
  • ตัวเชื่อมต่อแบบ Serverless: จัดกลุ่มที่อยู่ IP สำหรับแอปพลิเคชันขนาดใหญ่ ต้องชำระเงินสำหรับ VM พื้นฐาน ดูรายละเอียดราคาได้ที่ "การเข้าถึง VPC แบบ Serverless" ในหน้าราคา VPC

กำหนดค่าใน apphosting.yaml

ใช้vpcAccessการแมปในไฟล์ apphosting.yaml เพื่อกำหนดค่าการเข้าถึง ใช้ชื่อเครือข่าย/ตัวเชื่อมต่อที่สมบูรณ์ในตัวเองหรือใช้รหัส การใช้รหัสช่วยให้สามารถ ย้ายข้อมูลระหว่างสภาพแวดล้อมการจัดเตรียมและการใช้งานจริงที่มี ตัวเชื่อมต่อ/เครือข่ายที่แตกต่างกันได้

การกำหนดค่าขาออก VPC โดยตรง (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

การกำหนดค่าเครื่องมือเชื่อมต่อแบบ Serverless (apphosting.yaml):

runConfig:
  vpcAccess:
    egress: ALL_TRAFFIC
    connector: connector-id

ตัวอย่าง: เชื่อมต่อกับ Memorystore สำหรับ Redis จากแอป Next.js

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

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

  1. ไปที่หน้าMemorystore สำหรับ Redis ในคอนโซล Google Cloud
    • ตรวจสอบว่าได้เลือกโปรเจ็กต์เดียวกันกับที่ใช้สำหรับ Firebase App Hosting
    • หากเข้าถึงหน้านี้ไม่ได้ โปรดตรวจสอบว่าได้เปิดใช้การเรียกเก็บเงินสำหรับโปรเจ็กต์และได้เปิดใช้ Memorystore API แล้ว
  2. เลือกสร้างอินสแตนซ์
  3. กำหนดค่าอินสแตนซ์ใหม่ด้วยการตั้งค่าที่ต้องการ ตัวอย่างค่าที่คุณใช้ได้มีดังนี้
    • ป้อน my-redis-cache ในส่วนรหัสอินสแตนซ์
    • ป้อน 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. ค้นหาข้อมูลการเชื่อมต่อ (โฮสต์และพอร์ต) ในแท็บ "การเชื่อมต่อ" ของอินสแตนซ์ Memorystore for Redis ใน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 Hostingโปรแกรมจำลองสามารถลบล้างค่าได้โดยใช้ apphosting.emulator.yaml ในส่วนนี้ คุณสามารถเปลี่ยนค่าของ REDISHOST เป็น ชี้ไปยัง localhost เพื่อให้คุณพัฒนาในเครื่องได้โดยใช้การติดตั้ง Redis ในเครื่อง

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

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

    env:
  - variable: REDISHOST
    value: 127.0.0.1