Conecta Firebase App Hosting a una red de VPC

Tu backend de Firebase App Hosting puede conectarse a una red de nube privada virtual (VPC). Esto permite que tu backend de Firebase App Hosting acceda a servicios de backend a los que no se puede acceder con direcciones IP públicas, como Cloud SQL, Spanner, Cloud Memorystore, Compute Engine o microservicios internos de Kubernetes.

El acceso a VPC solo está disponible en el tiempo de ejecución (desde tu contenedor Cloud Run), no en el tiempo de compilación (Cloud Build).

Cómo configurar en apphosting.yaml

Usa la asignación de vpcAccess en tu archivo apphosting.yaml para configurar el acceso. Usa un nombre de red completamente calificado o un ID. El uso de IDs permite la portabilidad entre entornos de etapa de pruebas y de producción con diferentes conectores o redes.

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

Ejemplo: Cómo conectarse a Memorystore para Redis desde una app de Next.js

Los sistemas de almacenamiento en caché, como Redis o Memcached, se suelen usar para compilar una capa de almacenamiento en caché de datos rápida para una app. En este ejemplo, se muestra cómo configurar Memorystore para Redis en el mismo proyecto Google Cloud que tu backend de Firebase App Hosting y conectarte a él con la salida directa de VPC.

Paso 0: Crea una instancia de Memorystore para Redis

  1. Ve a la página Memorystore para Redis en la consola de Google Cloud.
    • Asegúrate de seleccionar el mismo proyecto que usas para Firebase App Hosting.
    • Si no puedes acceder a esta página, asegúrate de que la facturación esté habilitada para tu proyecto y de que hayas habilitado la API de Memorystore.
  2. Selecciona Crear instancia.
  3. Configura la instancia nueva con la configuración que prefieras. Estos son algunos valores de ejemplo que puedes usar:
    • Ingresa my-redis-cache en ID de instancia.
    • Ingresa Redis cache en Nombre visible.
    • Elige Básico en el selector de nivel. En el nivel básico, se designa un nodo independiente de Redis, en lugar del nivel estándar, que usa un nodo de réplica para crear una copia de seguridad de tus datos.
    • Elige la región del backend de App Hosting en el selector Región. Asegúrate de establecer este valor para que coincida con la región de tu backend.
    • Elige cualquiera en el selector de zonas.
    • Ingresa 5 en Capacidad. Esto establece tu capacidad de instancia en 5 GB.
    • Selecciona 5.0 en Versión (recomendado).
    • Elige predeterminada en el selector Red autorizada.

Paso 1: Actualiza apphosting.yaml con el ID de tu red de VPC

  1. Visita la página Redes de VPC en la consola de Google Cloud.
  2. Busca el ID de la red de VPC de tu instancia de Memorystore para Redis (a menudo será default).
  3. Establece la configuración de salida de VPC directa en apphosting.yaml con el ID de red de VPC:

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

Paso 2: Agrega variables de entorno que dirijan tu app a Redis

  1. Encuentra la información de conexión (host y puerto) en la pestaña "Conexiones" de tu instancia de Memorystore para Redis en la consola de Google Cloud.
  2. Conéctate a Redis con las variables de entorno REDISPORT y REDISHOST. Configura estos valores en apphosting.yaml con los valores de host y puerto de la consola Google Cloud:

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

Paso 3: Usa redis desde tu app

  1. Instala el paquete npm redis:

    npm install redis@latest

  2. Accede a tu caché de Redis desde tu código. Usa las variables de entorno configuradas en el paso anterior. Por ejemplo, así es como puedes leer desde una caché en un controlador de ruta de 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 });
      }
      

Paso 4 (opcional): Configura tu app para el desarrollo local

El emulador de Firebase App Hosting puede anular valores con apphosting.emulator.yaml. Aquí, puedes cambiar el valor de REDISHOST para que apunte al host local, de modo que puedas desarrollar de forma local con una instalación local de Redis.

  1. Instala Redis en tu máquina local
  2. Crea o edita apphosting.emulators.yaml para hacer referencia a tu instancia local:

    env:
      - variable: REDISHOST
        value: 127.0.0.1