Configure y administre proyectos y productos de Firebase a través de Terraform

1. Introducción

Objetivos

Puede utilizar Terraform para configurar y administrar un proyecto de Firebase, incluida la configuración programática de la infraestructura y los productos de Firebase.

Este codelab primero describe cómo crear un archivo de configuración de Terraform para crear un nuevo proyecto de Firebase, seguido de cómo configurar las aplicaciones y los productos de Firebase que desea usar en ese proyecto. También cubrimos los conceptos básicos de la línea de comandos de Terraform, como obtener una vista previa de los cambios que se realizarán y luego implementarlos.

Si desea aprender cómo configurar y administrar proyectos y productos de Firebase con Terraform, ¡este codelab es para usted!

lo que aprenderás

  • Cómo crear un archivo de configuración de Terraform ( *.tf )
  • Cómo utilizar los comandos CLI de Terraform para gestionar su infraestructura
  • Cómo modificar tu configuración para actualizar tus recursos y servicios
  • Cómo aplicar su configuración en una aplicación web real (llamada Friendly Chat )
  • Cómo definir configuraciones paralelas (y sincronizadas) en diferentes entornos (producción, puesta en escena, etc.)

Lo que necesitarás

Para tener éxito con este codelab, necesita conocimientos básicos de Terraform y su terminología, incluidos los siguientes requisitos previos:

  • Instale Terraform y familiarícese con Terraform utilizando sus tutoriales oficiales.

Este codelab proporciona una aplicación de muestra real para que puedas probar e interactuar con lo que aprovisionas a través de Terraform. Para hacer esto, necesitará lo siguiente:

  • El código de muestra para una aplicación web: descargue este código en el siguiente paso del codelab
  • El administrador de paquetes npm (que normalmente viene con Node.js ): instale estas herramientas
  • Firebase CLI : instale esta CLI e inicie sesión

2. Obtenga el código de inicio

En este codelab, puedes probar lo que aprovisionas a través de Terraform con una aplicación web real. Recomendamos hacer esto para comprender todos los pasos necesarios para utilizar los recursos proporcionados por Terraform.

Clona el repositorio GitHub del codelab desde la línea de comando:

git clone https://github.com/firebase/codelab-friendlychat-web

Alternativamente, si no tienes git instalado, puedes descargar el repositorio como un archivo ZIP .

3. Cree una configuración de Terraform

Configuración de Terraform

  1. En el código base de la aplicación de muestra descargada, navegue hasta la raíz del directorio web .
  2. En la raíz de ese directorio, cree un archivo de configuración de Terraform llamado main.tf con la siguiente configuración inicial:

    main.tf
    # Terraform configuration to set up providers by version.
terraform {
  required_providers {
    google-beta = {
      source  = "hashicorp/google-beta"
      version = "~> 4.0"
    }
  }
}

# Configure the provider not to use the specified project for quota check.
# This provider should only be used during project creation and initializing services.
provider "google-beta" {
  alias                 = "no_user_project_override"
  user_project_override = false
}

# Configure the provider that uses the new project's quota.
provider "google-beta" {
  user_project_override = true
}

Cada uno de los proveedores google-beta tiene un atributo llamado user_project_override que determina cómo se verificarán las cuotas de las operaciones de Terraform. Para aprovisionar la mayoría de los recursos, debe usar user_project_override = true , lo que significa comparar la cuota con su propio proyecto de Firebase. Sin embargo, para configurar su nuevo proyecto de modo que pueda aceptar controles de cuota, primero debe usar user_project_override=false . La sintaxis alias Terraform le permite distinguir entre las dos configuraciones de proveedores en los siguientes pasos de este codelab.

Inicialice Terraform en el directorio

Crear una nueva configuración por primera vez requiere descargar el proveedor especificado en la configuración.

Para realizar esta inicialización, ejecute el siguiente comando desde la raíz del mismo directorio que su archivo de configuración main.tf :

terraform init

4. Cree un proyecto de Firebase a través de Terraform

Para "crear un proyecto de Firebase", es importante recordar que cada proyecto de Firebase es en realidad un proyecto de Google Cloud, solo que con los servicios de Firebase habilitados.

Agregar bloques para el proyecto subyacente de Google Cloud y las API

  1. Primero, aprovisione el proyecto subyacente de Google Cloud.

    A su archivo de configuración main.tf , agregue el siguiente bloque de recursos.

    Debe especificar su propio nombre de proyecto (como "Terraform FriendlyChat Codelab" ) y su propio ID de proyecto (como "terraform-codelab-your-initials" ). Tenga en cuenta que el valor name solo se usa dentro de las interfaces de Firebase y no es visible para los usuarios finales. Sin embargo, el valor project_id identifica de forma única su proyecto ante Google, así que asegúrese de especificar un valor único. main.tf
    ...

# Create a new Google Cloud project.
resource "google_project" "default" {
  provider = google-beta.no_user_project_override

  name            = "<PROJECT_NAME_OF_YOUR_PROJECT>"
  project_id      = "<PROJECT_ID_OF_YOUR_PROJECT>"

  # Required for the project to display in any list of Firebase projects.
  labels = {
    "firebase" = "enabled"
  }
}
  2. A continuación, debe habilitar las API subyacentes requeridas: la API de uso de servicios y la API de administración de Firebase.

    Esta habilitación de API generalmente se maneja detrás de escena cuando usa Firebase console para crear un proyecto de Firebase, pero se debe indicar explícitamente a Terraform que realice esta habilitación.

    A su archivo de configuración main.tf (justo debajo del bloque que crea el nuevo proyecto de nube), agregue el siguiente bloque de recursos:

    main.tf
    ...

# Enable the required underlying Service Usage API.
resource "google_project_service" "serviceusage" {
  provider = google-beta.no_user_project_override

  project = google_project.default.project_id
  service = "serviceusage.googleapis.com"

  # Don't disable the service if the resource block is removed by accident.
  disable_on_destroy = false
}

# Enable the required underlying Firebase Management API.
resource "google_project_service" "firebase" {
  provider = google-beta.no_user_project_override

  project = google_project.default.project_id
  service = "firebase.googleapis.com"

  # Don't disable the service if the resource block is removed by accident.
  disable_on_destroy = false
}
    Al habilitar la API de uso del servicio, su nuevo proyecto podrá aceptar comprobaciones de cuota. Por lo tanto, para todo el aprovisionamiento de recursos y habilitación de servicios posteriores, debe utilizar el proveedor con user_project_override (no se necesita alias).

Agregue un bloque para habilitar los servicios de Firebase

Lo último que se requiere para "crear un proyecto de Firebase" es habilitar los servicios de Firebase en el proyecto.

Continuando con su archivo de configuración main.tf , agregue el siguiente bloque de recursos.

Como se mencionó anteriormente, tenga en cuenta que este bloque de recursos utiliza el proveedor con user_project_override (no se necesita alias).

principal.tf

...

# Enable Firebase services for the new project created above.
resource "google_firebase_project" "default" {
  provider = google-beta

  project = google_project.default.project_id

  # Wait until the required APIs are enabled.
  depends_on = [
    google_project_service.firebase,
    google_project_service.serviceusage,
  ]
}

En el bloque de recursos anterior, es posible que observe la cláusula depends_on , que le indica a Terraform que espere a que se habiliten las API subyacentes. Sin esta cláusula, Terraform no conoce la dependencia y puede sufrir errores al aprovisionar recursos en paralelo.

Aplicar la configuración

  1. Para aprovisionar los nuevos recursos y habilitar las API especificadas en su archivo de configuración, ejecute el siguiente comando desde la raíz del mismo directorio que su archivo main.tf (que debería ser web ):
    terraform apply
  2. En la terminal, Terraform imprime un plan de acciones que realizará.

    Si todo se ve como se esperaba, apruebe las acciones ingresando yes .

    main.tf
    Terraform used the selected providers to generate the following execution plan. Resource actions are indicated with the following symbols:
  + create

Terraform will perform the following actions:

  # google_firebase_project.default will be created
  + resource "google_firebase_project" "default" {
      + display_name   = (known after apply)
      + id             = (known after apply)
      + project        = "terraform-friendlychat-codelab"
      + project_number = (known after apply)
    }

  # google_project.default will be created
  + resource "google_project" "default" {
      + auto_create_network = true
      + id                  = (known after apply)
      + labels              = {
          + "firebase" = "enabled"
        }
      + name                = "Terraform FriendlyChat Codelab"
      + number              = (known after apply)
      + project_id          = "terraform-friendlychat-codelab"
      + skip_delete         = (known after apply)
    }

  # google_project_service.firebase will be created
  + resource "google_project_service" "firebase" {
      + disable_on_destroy = false
      + id                 = (known after apply)
      + project            = "terraform-friendlychat-codelab"
      + service            = "firebase.googleapis.com"
    }

  # google_project_service.serviceusage will be created
  + resource "google_project_service" "serviceusage" {
      + disable_on_destroy = false
      + id                 = (known after apply)
      + project            = "terraform-friendlychat-codelab"
      + service            = "serviceusage.googleapis.com"
    }

Plan: 4 to add, 0 to change, 0 to destroy.

Do you want to perform these actions?
  Terraform will perform the actions described above.
  Only 'yes' will be accepted to approve.

  Enter a value: yes # <----

Tenga en cuenta que si solo necesita obtener una vista previa de los cambios sin aplicarlos, puede usar el comando terraform plan en su lugar.

Validar los cambios

Una vez que Terraform termine de ejecutarse, puede inspeccionar el estado de todos los recursos y servicios aprovisionados de Terraform habilitados ejecutando el siguiente comando:

terraform show

A continuación se muestra un ejemplo de lo que debería ver impreso. Su estado contendrá valores específicos de su proyecto.

# google_firebase_project.default:
resource "google_firebase_project" "default" {
    display_name   = "Terraform FriendlyChat Codelab"
    id             = "projects/terraform-friendlychat-codelab"
    project        = "terraform-friendlychat-codelab"
    project_number = "000000000"
}

# google_project.default:
resource "google_project" "default" {
    auto_create_network = true
    id                  = "projects/terraform-friendlychat-codelab"
    labels              = {
        "firebase" = "enabled"
    }
    name                = "Terraform FriendlyChat Codelab"
    number              = "000000000"
    project_id          = "terraform-friendlychat-codelab"
}

# google_project_service.firebase:
resource "google_project_service" "firebase" {
    disable_on_destroy = false
    id                 = "terraform-friendlychat-codelab/firebase.googleapis.com"
    project            = "terraform-friendlychat-codelab"
    service            = "firebase.googleapis.com"
}

# google_project_service.serviceusage:
resource "google_project_service" "serviceusage" {
    disable_on_destroy = false
    id                 = "terraform-friendlychat-codelab/serviceusage.googleapis.com"
    project            = "terraform-friendlychat-codelab"
    service            = "serviceusage.googleapis.com"
}

Alternativamente, puedes verificar que el proyecto se haya creado visualizándolo en Firebase console .

The Terraform FriendlyChat Codelab project selected on the Firebase console

5. Registre su aplicación Firebase a través de Terraform

Para usar Firebase, debes registrar cada variante de plataforma de tu aplicación en tu proyecto de Firebase. En este codelab, utilizará una aplicación real para probar e interactuar con lo que aprovisiona a través de Terraform. Esta aplicación es una aplicación web, por lo que debe indicarle a Terraform que registre una aplicación web Firebase en su proyecto Firebase recién creado.

Agregue un bloque para registrar la aplicación web

Para registrar su aplicación web en su proyecto de Firebase, agregue su archivo main.tf con el siguiente bloque de recursos.

Debe especificar su propio display_name para su aplicación web. Tenga en cuenta que este nombre solo se usa dentro de las interfaces de Firebase y no es visible para los usuarios finales.

principal.tf

...

# Create a Firebase Web App in the new project created above.
resource "google_firebase_web_app" "default" {
  provider = google-beta

  project      = google_firebase_project.default.project
  display_name = "<DISPLAY_NAME_OF_YOUR_WEB_APP>"
  deletion_policy = "DELETE"
}

Aplicar la configuración

  1. Para aprovisionar el nuevo recurso, ejecute el siguiente comando desde la raíz del mismo directorio que su archivo main.tf (que debería ser web ).
    terraform apply
    Tenga en cuenta que este comando no volverá a crear un nuevo proyecto de Google Cloud. Terraform detectará que ya existe un proyecto con el ID de proyecto especificado y comparará el estado actual del proyecto con lo que hay en el archivo .tf y realizará los cambios que encuentre.
  2. Revisar el plan de acciones impreso. Si todo se ve como se esperaba, escriba yes y presione Entrar para aprobar las acciones.

Validar los cambios

Puede inspeccionar el estado del recurso recién aprovisionado ejecutando el siguiente comando:

terraform show

Alternativamente, puedes verificar que la aplicación se registró correctamente en tu proyecto viéndola en Firebase console. Vaya a Configuración del proyecto y luego desplácese hacia abajo hasta la sección Sus aplicaciones .

6. Configurar la autenticación de Firebase

La autenticación es una parte importante de cualquier aplicación. Para permitir que los usuarios finales inicien sesión en su aplicación web con sus cuentas de Google, puede habilitar la autenticación de Firebase y configurar el método de inicio de sesión con Google.

Tenga en cuenta que en este codelab proporcionamos dos opciones diferentes para configurar la autenticación de Firebase:

  • Opción 1 (recomendada) : configurar Firebase Authentication en la consola, que no requiere GCIP.
    • Usar esta opción significa que no tienes que asociar tu nuevo proyecto con una cuenta de facturación de Cloud.
  • Opción 2 : configurar la autenticación de Firebase a través de Terraform utilizando las API de Google Cloud Identity Platform (GCIP).
    • Usar esta opción significa que debe asociar su nuevo proyecto con una cuenta de facturación en la nube, ya que GCIP requiere que el proyecto esté en el plan de precios Blaze.

Opción 1: configurar la autenticación mediante Firebase console

Para configurar Firebase Authentication usando Firebase console, no es necesario que tu proyecto esté en el plan de precios de Blaze.

A continuación se explica cómo configurar la autenticación de Firebase e iniciar sesión con Google:

  1. En Firebase console , ubica la sección Build en el panel izquierdo.
  2. Haga clic en Autenticación , haga clic en Comenzar y luego haga clic en la pestaña Método de inicio de sesión (o haga clic aquí para ir directamente allí).
  3. Haga clic en Agregar nuevo proveedor y, en la sección Proveedores adicionales , seleccione Google .
  4. Active la palanca Habilitar .
  5. Establezca el nombre público de su aplicación en algo como FriendlyChat (no es necesario que sea globalmente único).
  6. Elija un correo electrónico de soporte del proyecto en el menú desplegable y luego haga clic en Guardar . Configuring Firebase Auth on the Firebase console
  7. Deberías ver a Google como un proveedor de inicio de sesión habilitado. Firebase console Authentication page: Google sign-in enabled

Opción 2: configurar la autenticación a través de Terraform utilizando las API de Google Cloud Identity Platform (GCIP)

Para configurar Firebase Authentication a través de Terraform, debe usar las API de GCIP, lo que significa que el proyecto debe estar en el plan de precios de Blaze. Actualizas tu proyecto de Firebase para usar el plan Blaze asociando una cuenta de facturación de Cloud con el proyecto.

Habilitar facturación a través de Terraform

  1. Si aún no tienes una cuenta de facturación de Cloud, el primer paso es crear una nueva cuenta en Google Cloud Console . Cuando hagas esto, anota su ID de cuenta de facturación . El ID de la cuenta de facturación se puede ubicar en la página Facturación en el ID de la cuenta de facturación asociada con su proyecto. Enabling a billing account using the Google Cloud console
  2. Para habilitar la facturación en su proyecto a través de Terraform, agregue un atributo billing_account al recurso google_project existente en su archivo main.tf :

    main.tf
    ...

# Create a new Google Cloud project.
resource "google_project" "default" {
  provider = google-beta.no_user_project_override

  name            = "<PROJECT_NAME_OF_YOUR_PROJECT>"
  project_id      = "<PROJECT_ID_OF_YOUR_PROJECT>"
  billing_account = "<YOUR_BILLING_ACCOUNT_ID>" # Add this line with your Cloud Billing account ID

  # Required for the project to display in any list of Firebase projects.
  labels = {
    "firebase" = "enabled"
  }
}

...

Habilite la autenticación de Firebase e inicie sesión con Google a través de Terraform

  1. Para aprovisionar Firebase Authentication con GCIP, agregue su archivo main.tf con los siguientes bloques de recursos:

    main.tf
    ...

# Enable the Identity Toolkit API.
resource "google_project_service" "auth" {
  provider = google-beta

  project  = google_firebase_project.default.project
  service =  "identitytoolkit.googleapis.com"

  # Don't disable the service if the resource block is removed by accident.
  disable_on_destroy = false
}

# Create an Identity Platform config.
# Also, enable Firebase Authentication using Identity Platform (if Authentication isn't yet enabled).
resource "google_identity_platform_config" "auth" {
  provider = google-beta
  project  = google_firebase_project.default.project

  # For example, you can configure to auto-delete anonymous users.
  autodelete_anonymous_users = true

  # Wait for identitytoolkit.googleapis.com to be enabled before initializing Authentication.
  depends_on = [
    google_project_service.auth,
  ]
}
  2. Para habilitar el inicio de sesión con Google es necesario tener un cliente OAuth . Vaya a la sección API y servicios de Google Cloud Console para realizar esta configuración.
  3. Dado que esta es la primera vez que crea una ID de cliente para este proyecto, debe configurar su pantalla de consentimiento de OAuth.
    1. Abra la página de la pantalla de consentimiento de OAuth y luego seleccione el proyecto que acaba de crear.
    2. Establezca el Tipo de usuario en Externo y luego haga clic en Crear .
    3. En la siguiente pantalla, complete lo siguiente y luego haga clic en Guardar y continuar .
      • Establezca el nombre de la aplicación pública de su aplicación en algo como FriendlyChat (no es necesario que sea globalmente único).
      • Elija un correo electrónico de asistencia al usuario en el menú desplegable.
      • Ingrese un correo electrónico para la información de contacto del desarrollador .
    4. En las siguientes pantallas, complete lo siguiente:
      • Acepte los valores predeterminados en la página Ámbitos y luego haga clic en Guardar y continuar .
      • Acepte los valores predeterminados en la página Probar usuarios y luego haga clic en Guardar y continuar .
      • Revise el resumen y luego haga clic en Volver al panel .
      Configuring an OAuth2 client using the Google Cloud console
  4. Configure un cliente OAuth en la página Credenciales haciendo lo siguiente:
    1. Haga clic en Crear credenciales y seleccione ID de cliente de OAuth .
    2. En el menú desplegable Tipo de aplicación , seleccione Aplicación web .
    3. En el campo Nombre , ingrese el nombre de su aplicación, por ejemplo FriendlyChat (no es necesario que sea globalmente único).
    4. Permita que la URL de su aplicación utilice este cliente OAuth configurando lo siguiente:
      • En Orígenes de JavaScript autorizados , haga clic en Agregar URI e ingrese
        https://<PROJECT_ID>.firebaseapp.com , donde <PROJECT_ID> es el ID del proyecto que configuró en main.tf
      • En URI de redireccionamiento autorizados , haga clic en Agregar URI e ingrese
        https://<PROJECT_ID>.firebaseapp.com/__/auth/handler , donde <PROJECT_ID> es el ID del proyecto que configuró en main.tf
    5. Clic en Guardar .
    Obtaining the OAuth2 Client ID and secret from the Google Cloud console Credentials page
  5. Para habilitar el inicio de sesión con Google utilizando su ID de cliente de OAuth y su secreto de cliente, agregue su archivo main.tf con el siguiente bloque:

    main.tf
    ...

variable "oauth_client_secret" {
  type = string

  description = "OAuth client secret. For this codelab, you can pass in this secret through the environment variable TF_VAR_oauth_client_secret. In a real app, you should use a secret manager service."

  sensitive = true
}

resource "google_identity_platform_default_supported_idp_config" "google_sign_in" {
  provider = google-beta
  project  = google_firebase_project.default.project

  enabled       = true
  idp_id        = "google.com"
  client_id     = "<YOUR_OAUTH_CLIENT_ID>"
  client_secret = var.oauth_client_secret

  depends_on = [
     google_identity_platform_config.auth
  ]
}

Aplicar la configuración

  1. Para configurar la autenticación de acuerdo con su configuración, ejecute los siguientes comandos desde la raíz del mismo directorio que su archivo main.tf (que debería ser web ):
    export TF_VAR_oauth_client_secret="<YOUR_OAUTH_CLIENT_SECRET>"

    terraform apply
    Tenga en cuenta que ejecutar terraform apply no volverá a crear un nuevo proyecto de Google Cloud. Terraform detectará que ya existe un proyecto con el ID de proyecto especificado y comparará el estado actual del proyecto con lo que hay en el archivo .tf . Luego realizará los cambios que encuentre.
  2. Revisar el plan de acciones impreso. Si todo se ve como se esperaba, escriba yes y presione Entrar para aprobar las acciones.

Validar los cambios

  1. En Firebase console , ubica la sección Build en el panel izquierdo.
  2. Haga clic en Autenticación y luego haga clic en la pestaña Método de inicio de sesión (o haga clic aquí para ir directamente allí).
  3. Deberías ver a Google como un proveedor de inicio de sesión habilitado. Firebase console Authentication page: Google sign-in enabled

7. Configure una base de datos de Firestore y sus reglas de seguridad

Para la aplicación web de este codelab, almacenarás mensajes entre usuarios finales en una base de datos de Firestore.

  1. Para habilitar las API requeridas y aprovisionar la instancia de la base de datos, agregue su archivo main.tf con los siguientes bloques de recursos:

    main.tf
    ...

# Enable required APIs for Cloud Firestore.
resource "google_project_service" "firestore" {
  provider = google-beta

  project  = google_firebase_project.default.project
  for_each = toset([
    "firestore.googleapis.com",
    "firebaserules.googleapis.com",
  ])
  service = each.key

  # Don't disable the service if the resource block is removed by accident.
  disable_on_destroy = false
}

# Provision the Firestore database instance.
resource "google_firestore_database" "default" {
  provider                    = google-beta

  project                     = google_firebase_project.default.project
  name                        = "(default)"
  # See available locations:
  # https://firebase.google.com/docs/firestore/locations
  location_id                 = "<NAME_OF_DESIRED_REGION>"
  # "FIRESTORE_NATIVE" is required to use Firestore with Firebase SDKs,
  # authentication, and Firebase Security Rules.
  type                        = "FIRESTORE_NATIVE"
  concurrency_mode            = "OPTIMISTIC"

  depends_on = [
    google_project_service.firestore
  ]
}
  2. Cambie <NAME_OF_DESIRED_REGION> a la región donde desea que resida la base de datos.

    Al desarrollar una aplicación de producción, querrás que esté en una región cercana a la mayoría de los usuarios y en común con otros servicios de Firebase, como Cloud Functions. Para este codelab, puedes usar us-east1 (Carolina del Sur) o usar la región más cercana a ti (consulta Ubicaciones de Cloud Firestore ).
  3. Cada instancia de base de datos de Firestore a la que Firebase puede acceder debe estar protegida por las reglas de seguridad de Firebase .

    El código de muestra de este codelab proporciona un conjunto de reglas seguras de Firestore en el archivo firestore.rules , que puede encontrar en la raíz del directorio web .
  4. Agregue su archivo main.tf con los siguientes bloques de recursos para hacer lo siguiente:
    • Cree un conjunto de reglas de reglas de seguridad de Firebase desde el archivo firestore.rules local.
    • Libere el conjunto de reglas para la instancia de Firestore.
    Tenga en cuenta que estos bloques de recursos equivalen a hacer clic en el botón Publicar en Firebase console o ejecutar firebase deploy --only firestore:rules .

    main.tf
    ...

# Create a ruleset of Firestore Security Rules from a local file.
resource "google_firebaserules_ruleset" "firestore" {
  provider = google-beta

  project  = google_firebase_project.default.project
  source {
    files {
      name = "firestore.rules"
      # Write security rules in a local file named "firestore.rules".
      # Learn more: https://firebase.google.com/docs/firestore/security/get-started
      content = file("firestore.rules")
    }
  }

  # Wait for Firestore to be provisioned before creating this ruleset.
  depends_on = [
    google_firestore_database.default,
  ]
}

# Release the ruleset for the Firestore instance.
resource "google_firebaserules_release" "firestore" {
  provider     = google-beta

  name         = "cloud.firestore"  # must be cloud.firestore
  ruleset_name = google_firebaserules_ruleset.firestore.name
  project      = google_firebase_project.default.project

  # Wait for Firestore to be provisioned before releasing the ruleset.
  depends_on = [
    google_firestore_database.default,
  ]

  lifecycle {
    replace_triggered_by = [
      google_firebaserules_ruleset.firestore
    ]
  }
}
  5. Ejecute terraform apply para aprovisionar la base de datos de Firestore e implementar sus reglas de seguridad.
  6. Verifique que la base de datos esté aprovisionada y que sus reglas de seguridad estén implementadas:
    1. En Firebase console , ubica la sección Build en el panel izquierdo.
    2. Vaya a la sección Base de datos de Firestore y luego haga clic en la pestaña Reglas .
    Verifying Cloud Firestore rules using the Firebase console

8. Configure un depósito de Cloud Storage y sus reglas de seguridad

Para la aplicación web de este codelab, almacenarás imágenes compartidas entre usuarios finales en un depósito de Cloud Storage.

  1. Para habilitar las API requeridas y aprovisionar su depósito predeterminado de Cloud Storage, agregue su archivo main.tf con los siguientes bloques de recursos.

    Tenga en cuenta que el depósito de Cloud Storage predeterminado para su proyecto se aprovisiona a través de Google App Engine y debe tener la misma ubicación que su base de datos de Firestore. Consulte Ubicaciones de App Engine para obtener más información.

    Si desea varios depósitos en su proyecto, aprovisionelos utilizando el recurso google_storage_bucket (no se muestra en este codelab).

    main.tf
    ...

# Enable required APIs for Cloud Storage for Firebase.
resource "google_project_service" "storage" {
  provider = google-beta

  project  = google_firebase_project.default.project
  for_each = toset([
    "firebasestorage.googleapis.com",
    "storage.googleapis.com",
  ])
  service = each.key


  # Don't disable the service if the resource block is removed by accident.
  disable_on_destroy = false
}

# Provision the default Cloud Storage bucket for the project via Google App Engine.
resource "google_app_engine_application" "default" {
  provider    = google-beta

  project     = google_firebase_project.default.project
  # See available locations: https://firebase.google.com/docs/projects/locations#default-cloud-location
  # This will set the location for the default Storage bucket and the App Engine App.
  location_id = "<NAME_OF_DESIRED_REGION_FOR_DEFAULT_BUCKET>"  # Must be in the same location as Firestore (above)

  # Wait until Firestore is provisioned first.
  depends_on = [
    google_firestore_database.default
  ]
}

# Make the default Storage bucket accessible for Firebase SDKs, authentication, and Firebase Security Rules.
resource "google_firebase_storage_bucket" "default-bucket" {
  provider  = google-beta

  project   = google_firebase_project.default.project
  bucket_id = google_app_engine_application.default.default_bucket
}
  2. Cada depósito de Cloud Storage al que puede acceder Firebase debe estar protegido por las reglas de seguridad de Firebase .

    El código de muestra de este codelab proporciona un conjunto de reglas seguras de Firestore en el archivo storage.rules , que puede encontrar en la raíz del directorio web .
  3. Agregue su archivo main.tf con los siguientes bloques de recursos para hacer lo siguiente:
    • Cree un conjunto de reglas de reglas de seguridad de Firebase a partir del archivo local.
    • Libere el conjunto de reglas para el depósito de almacenamiento.
    Tenga en cuenta que estos bloques de recursos equivalen a hacer clic en el botón Publicar en Firebase console o ejecutar firebase deploy --only storage .

    main.tf
    ...

# Create a ruleset of Cloud Storage Security Rules from a local file.
resource "google_firebaserules_ruleset" "storage" {
  provider = google-beta

  project  = google_firebase_project.default.project
  source {
    files {
      # Write security rules in a local file named "storage.rules".
      # Learn more: https://firebase.google.com/docs/storage/security/get-started
      name    = "storage.rules"
      content = file("storage.rules")
    }
  }

  # Wait for the default Storage bucket to be provisioned before creating this ruleset.
  depends_on = [
    google_firebase_storage_bucket.default-bucket,
  ]
}

# Release the ruleset to the default Storage bucket.
resource "google_firebaserules_release" "default-bucket" {
  provider     = google-beta

  name         = "firebase.storage/${google_app_engine_application.default.default_bucket}"
  ruleset_name = "projects/${google_firebase_project.default.project}/rulesets/${google_firebaserules_ruleset.storage.name}"
  project      = google_firebase_project.default.project

  lifecycle {
    replace_triggered_by = [
      google_firebaserules_ruleset.storage
    ]
  }
}
  4. Ejecute terraform apply para aprovisionar el depósito predeterminado de Cloud Storage e implementar sus reglas de seguridad.
  5. Verifique que el depósito esté aprovisionado y que sus reglas de seguridad estén implementadas:
    1. En Firebase console , ubica la sección Build en el panel izquierdo.
    2. Vaya a la sección Almacenamiento y luego haga clic en la pestaña Reglas .
    Verifying security rules using the Firebase console

9. Ejecute su aplicación localmente

¡Ya está listo para ejecutar su aplicación web por primera vez! Utilizará el emulador de Firebase Hosting para ofrecer su aplicación localmente.

  1. Abra una nueva ventana de terminal y, desde el directorio web , ejecute el siguiente comando de Firebase CLI para iniciar el emulador:
    firebase emulators:start --project=<PROJECT_ID>
  2. En su navegador, abra su aplicación web en la URL local devuelta por la CLI (normalmente http://localhost:5000 ).

Deberías ver la interfaz de usuario de tu aplicación FriendlyChat, que (¡todavía!) no funciona. La aplicación aún no está conectada a Firebase, pero al completar los siguientes pasos de este codelab, ¡lo estará!

Tenga en cuenta que cada vez que realice cambios en su aplicación web (como lo hará en los siguientes pasos de este codelab), actualice su navegador para actualizar la URL local con esos cambios.

10. Instalar, configurar e inicializar Firebase

Para que una aplicación funcione con Firebase, su aplicación necesita el SDK de Firebase y la configuración de Firebase para su proyecto de Firebase.

El código de muestra para este codelab ya es una aplicación funcional con todas las dependencias y funciones necesarias para usar varios productos de Firebase en la aplicación. Puede buscar en web/package.json y web/src/index.js si desea ver lo que ya se ha hecho.

Aunque el código de muestra está casi completo, aún necesita hacer algunas cosas para que su aplicación se ejecute, que incluyen: instalar el SDK de Firebase, iniciar su compilación, agregar la configuración de Firebase a su aplicación y, finalmente, inicializar Firebase.

Instale el SDK de Firebase y comience la compilación de su paquete web

Debes ejecutar algunos comandos para iniciar la compilación de tu aplicación.

  1. Abra una nueva ventana de terminal.
  2. Asegúrate de estar en la raíz del directorio web .
  3. Ejecute npm install para descargar el SDK de Firebase.
  4. Ejecute npm update para actualizar cualquier dependencia.
  5. Ejecute npm run start para iniciar el paquete web.

Para el resto del codelab, webpack ahora reconstruirá continuamente su código fuente.

Agrega tu configuración de Firebase a tu aplicación

También debes agregar tu configuración de Firebase a tu aplicación para que los SDK de Firebase sepan qué proyecto de Firebase quieres que usen.

Para este codelab, tienes dos opciones diferentes para obtener tu configuración de Firebase:

  • Opción 1 : obtenga su configuración de Firebase desde la consola de Firebase.
  • Opción 2 : obtenga su configuración de Firebase a través de Terraform.

Opción 1: obtenga la configuración de Firebase console y agréguela a su código base

  1. En Firebase console, ve a la configuración de tu proyecto .
  2. Desplácese hacia abajo hasta la tarjeta Sus aplicaciones y luego seleccione su aplicación web.
  3. Seleccione Configuración en el panel de fragmentos del SDK de Firebase y luego copie el fragmento de configuración.
  4. Pega tu configuración en el archivo web/src/firebase-config.js de tu aplicación, así:

    firebase-config.js
    ...

const config = {
  apiKey: "<API_KEY>",
  authDomain: "<PROJECT_ID>.firebaseapp.com",
  projectId: "<PROJECT_ID>",
  storageBucket: "<PROJECT_ID>.appspot.com",
  messagingSenderId: "<SENDER_ID>",
  appId: "<APP_ID>",
  measurementId: "<G-MEASUREMENT_ID>",
};

...

Opción 2: obtenga la configuración a través de Terraform y agréguela a su código base

Alternativamente, puede obtener su configuración de Firebase a través de Terraform como valor de salida en la CLI.

  1. En su archivo main.tf , busque su bloque de recursos google_firebase_web_app (el bloque que registró una aplicación web con su proyecto).
  2. Inmediatamente después de ese bloque, agregue los siguientes bloques:

    main.tf
    ...

data "google_firebase_web_app_config" "default" {
  provider     = google-beta
  project      = google_firebase_project.default.project
  web_app_id   = google_firebase_web_app.default.app_id
}

output "friendlychat_web_app_config" {
  value = {
    projectId         = google_firebase_project.default.project
    appId             = google_firebase_web_app.default.app_id
    apiKey            = data.google_firebase_web_app_config.default.api_key
    authDomain        = data.google_firebase_web_app_config.default.auth_domain
    storageBucket     = lookup(data.google_firebase_web_app_config.default, "storage_bucket", "")
    messagingSenderId = lookup(data.google_firebase_web_app_config.default, "messaging_sender_id", "")
    measurementId     = lookup(data.google_firebase_web_app_config.default, "measurement_id", "")
  }
}

...
  3. Dado que el bloque data y el bloque output no están destinados a modificar la infraestructura de ninguna manera, solo necesita ejecutar los siguientes comandos.
    1. Para cargar la configuración de Firebase de su aplicación web en el estado Terraform de su directorio, ejecute este comando:
      terraform refresh
    2. Para imprimir los valores de configuración de Firebase, ejecute este comando:
      terraform output –json
      El siguiente es un ejemplo de resultado de una configuración. Su salida impresa contendrá los valores de su proyecto y aplicación.
      {
  "friendlychat_web_app_config": {
    "sensitive": false,
    "type": [
      "object",
      {
        "apiKey": "string",
        "appId": "string",
        "authDomain": "string",
        "measurementId": "string",
        "messagingSenderId": "string",
        "projectId": "string",
        "storageBucket": "string"
      }
    ],
    "value": {
      "apiKey": "<API_KEY>",
      "appId": "<APP_ID>",
      "authDomain": "<PROJECT_ID>.firebaseapp.com",
      "measurementId": "<G-MEASUREMENT_ID>",
      "messagingSenderId": "<SENDER_ID>",
      "projectId": "<PROJECT_ID>",
      "storageBucket": "<PROJECT_ID>.appspot.com"
    }
  }
}
  4. Copie los valores desde dentro del mapa value .
  5. Pegue estos valores (su configuración) en el archivo web/src/firebase-config.js de su aplicación, así:

    firebase-config.js
    ...

const config = {
  apiKey: "<API_KEY>",
  appId: "<APP_ID>",
  authDomain: "<PROJECT_ID>.firebaseapp.com",
  measurementId: "<G-MEASUREMENT_ID>",
  messagingSenderId: "<SENDER_ID>",
  projectId: "<PROJECT_ID>",
  storageBucket: "<PROJECT_ID>.appspot.com",
};

...

Inicializa Firebase en tu aplicación

Finalmente, para inicializar Firebase, agregue el archivo web/src/index.js de su aplicación con lo siguiente:

index.js

...

const firebaseAppConfig = getFirebaseConfig();
initializeApp(firebaseAppConfig);

Prueba tu aplicación

Ahora que todo está configurado para Firebase, puedes probar tu aplicación web funcional.

  1. Actualiza el navegador que sirve tu aplicación.
  2. Ahora debería poder iniciar sesión en Google y comenzar a publicar mensajes en el chat. Si tienes archivos de imágenes, ¡incluso puedes subirlos!

11. Replica tu configuración en todos los entornos

Terraform se destaca en la administración de múltiples infraestructuras configuradas de manera similar (por ejemplo, configurando un proyecto provisional de Firebase que es similar a un proyecto de producción).

En este codelab, crearás un segundo proyecto de Firebase como entorno de prueba.

Para replicar una configuración existente para crear este proyecto provisional, tiene dos opciones:

  • Opción 1 : hacer una copia de la configuración de Terraform.
    Esta opción ofrece la mayor flexibilidad en cuanto a cuánto puede diferir el proyecto replicado del proyecto de origen.
  • Opción 2 : reutilizar configuraciones con for_each .
    Esta opción ofrece más reutilización de código si cada proyecto no debe diferir de manera significativa y desea propagar los cambios a todos los proyectos a la vez.

Opción 1: hacer una copia de la configuración de Terraform

Esta opción ofrece la mayor flexibilidad en cuanto a cuánto puede diferir el proyecto replicado del proyecto de origen, como tener aplicaciones con diferentes nombres para mostrar e implementaciones por etapas.

  1. En la raíz de su directorio web , cree un nuevo archivo de configuración de Terraform llamado main_staging.tf .
  2. Copie todos los bloques de recursos de su archivo main.tf (excepto los bloques terraform y provider ) y luego péguelos en su archivo main_staging.tf .
  3. Luego deberá modificar cada uno de sus bloques de recursos replicados en main_staging.tf para que funcionen con su proyecto de prueba:
    • Etiquetas de recursos: utilice un nombre nuevo para evitar conflictos. Por ejemplo, cambie el nombre resource "google_project" "default" a resource "google_project" "staging" .
    • Referencias de recursos: actualice cada una. Por ejemplo, actualice google_firebase_project.default.project a google_firebase_project.staging.project .
    Puedes encontrar la configuración completa de un archivo main_staging.tf en el repositorio GitHub de este codelab:

    web/terraform-checkpoints/replicate-config/main_staging-copypaste.tf

    Si desea utilizar esta configuración, asegúrese de hacer lo siguiente:
    1. Copie la configuración de main_staging-copypaste.tf y luego péguela en su archivo main_staging.tf .
    2. En su archivo main_staging.tf , haga lo siguiente:
      • En el bloque de recursos google_project , actualice el atributo name , el atributo project-id y (si configura la autenticación a través de Terraform) el atributo billing_account con sus propios valores.
      • En el bloque de recursos google_firebase_web_app , actualice el atributo display_name con su propio valor.
      • En los bloques de recursos google_firestore_database y google_app_engine_application , actualice los atributos location_id con su propio valor.
    main_staging.tf
    # Create a new Google Cloud project.
resource "google_project" "staging" {
  provider = google-beta.no_user_project_override

  name            = "<PROJECT_NAME_OF_STAGING_PROJECT>"
  project_id      = "<PROJECT_ID_OF_STAGING_PROJECT"
  # Required if you want to set up Authentication via Terraform
  billing_account = "<YOUR_BILLING_ACCOUNT_ID>"

  # Required for the project to display in any list of Firebase projects.
  labels = {
    "firebase" = "enabled"
  }
}

# Enable the required underlying Service Usage API.
resource "google_project_service" "staging_serviceusage" {
  provider = google-beta.no_user_project_override

  project = google_project.staging.project_id
  service = "serviceusage.googleapis.com"

  # Don't disable the service if the resource block is removed by accident.
  disable_on_destroy = false
}

# Enable the required underlying Firebase Management API.
resource "google_project_service" "staging_firebase" {
  provider = google-beta.no_user_project_override

  project = google_project.staging.project_id
  service = "firebase.googleapis.com"

  # Don't disable the service if the resource block is removed by accident.
  disable_on_destroy = false
}

# Enable Firebase services for the new project created above.
resource "google_firebase_project" "staging" {
  provider = google-beta

  project = google_project.staging.project_id

  # Wait until the required APIs are enabled.
  depends_on = [
    google_project_service.staging_serviceusage,
    google_project_service.staging_firebase,
  ]
}

# Create a Firebase Web App in the new project created above.
resource "google_firebase_web_app" "staging" {
  provider = google-beta

  project      = google_firebase_project.staging.project
  display_name = "<DISPLAY_NAME_OF_YOUR_WEB_APP>"
  deletion_policy = "DELETE"
}
  4. Ejecute terraform apply para aprovisionar su nuevo proyecto "ensayo" de Firebase y todos sus recursos y habilitar sus servicios.
  5. Verifique que todo esté aprovisionado y habilitado como se esperaba revisándolos en Firebase console como antes.

Opción 2: reutilizar configuraciones con for_each

Esta opción ofrece más reutilización de código si cada proyecto no debe diferir de manera significativa y desea propagar los cambios a todos los proyectos a la vez. Utiliza el metaargumento for_each en el lenguaje Terraform.

  1. Abra su archivo main.tf
  2. En cada bloque de recursos que desee replicar, agregue un metaargumento for_each , así:

    main.tf
    # Create new Google Cloud projects.
resource "google_project" "default" {
  provider        = google-beta.no_user_project_override
  name            = each.value
  # Create a unique project ID for each project, with each ID starting with <PROJECT_ID>.
  project_id      = "<PROJECT_ID>-${each.key}"
  # Required if you want to set up Authentication via Terraform
  billing_account = "<YOUR_BILLING_ACCOUNT_ID>"

  # Required for the projects to display in any list of Firebase projects.
  labels = {
    "firebase" = "enabled"
  }

  for_each = {
    prod    = "<PROJECT_NAME_OF_PROD_PROJECT>"
    staging = "<PROJECT_NAME_OF_STAGING_PROJECT>"
  }
}

# Enable the required underlying Service Usage API.
resource "google_project_service" "serviceusage" {
  provider = google-beta.no_user_project_override
  for_each = google_project.default

  project = each.value.project_id
  service = "serviceusage.googleapis.com"

  # Don't disable the service if the resource block is removed by accident.
  disable_on_destroy = false
}

# Enable the required underlying Firebase Management API.
resource "google_project_service" "firebase" {
  provider = google-beta.no_user_project_override
  for_each = google_project.default

  project = each.value.project_id
  service = "firebase.googleapis.com"

  # Don't disable the service if the resource block is removed by accident.
  disable_on_destroy = false
}

# Enable Firebase services for each of the new projects created above.
resource "google_firebase_project" "default" {
  provider = google-beta
  for_each = google_project.default

  project = each.value.project_id

  depends_on = [
    google_project_service.serviceusage,
    google_project_service.firebase,
  ]
}

# Create a Firebase Web App in each of the new projects created above.
resource "google_firebase_web_app" "default" {
  provider = google-beta
  for_each = google_firebase_project.default

  project      = each.value.project
  # The Firebase Web App created in each project will have the same display name.
  display_name = "<DISPLAY_NAME_OF_YOUR_WEB_APP>"
  deletion_policy = "DELETE"
}


# NOTE: For this codelab, we recommend setting up Firebase Authentication
# using the Firebase console. However, if you set up Firebase Authentication
# using Terraform, copy-paste from your main.tf the applicable blocks.
# Make sure to add the `for_each` meta-argument into each block.


# Copy-paste from your main.tf file the applicable resource blocks
# for setting up Cloud Firestore (including rules) and
# for setting up Cloud Storage for Firebase (including rules).
# Make sure to add the `for_each` meta-argument into each block.
    Puedes encontrar la configuración completa de un archivo main.tf que utiliza el metaargumento for_each en el repositorio GitHub de este codelab:

    web/terraform-checkpoints/replicate-config/main-foreach.tf

    Si desea utilizar esta configuración, asegúrese de hacer lo siguiente:
    1. Copie la configuración de main-foreach.tf y luego péguela en su archivo main.tf
    2. En su archivo main.tf , haga lo siguiente:
      • En el bloque de recursos google_project , actualice el atributo name , el atributo project-id y (si configura la autenticación a través de Terraform) el atributo billing_account con sus propios valores.
      • En el bloque de recursos google_firebase_web_app , actualice el atributo display_name con su propio valor.
      • En google_firestore_database y google_app_engine_application Bloques de recursos, actualice los atributos location_id con su propio valor.
  3. En lugar de aplicar esta configuración de inmediato, es importante comprender y arreglar algunas cosas sobre cómo Terraform interpreta esta configuración en comparación con la infraestructura existente.
    1. En este momento, si aplicó esta configuración que usa for_each , las direcciones de recursos se verían como las siguientes:
      google_project.default["prod"]
google_project.default["staging"]
google_firebase_project.default["prod"]
google_firebase_project.default["staging"]
google_firebase_web_app.default["prod"]
google_firebase_web_app.default["staging"]
      Sin embargo, el proyecto existente que creó en la primera parte de este Codelab se sabe que Terraform como el siguiente:
      google_project.default
google_firebase_project.default
google_firebase_android_app.default
    2. Ejecute terraform plan para ver qué acciones tomarían Terraform dado el estado actual.

      La salida debe mostrar que Terraform eliminaría el proyecto que creó en la primera parte de este Codelab y crearía dos proyectos nuevos. Esto se debe a que Terraform no sabe que el proyecto en la dirección google_project.default se ha trasladado a la nueva dirección google_project.default["prod"] .
    3. Para solucionar esto, ejecute el comando terraform state mv :
      terraform state mv "google_project.default" "google_project.default[\"prod\"]"
    4. Del mismo modo, para corregir todos los otros bloques de recursos, ejecute terraform state mv para google_firebase_project , google_firebase_web_app y todos los demás bloques de recursos en su archivo main.tf
    5. Ahora, si vuelve a ejecutar terraform plan , no debería demostrar que Terraform eliminaría el proyecto que creó en la primera parte de este Codelab.
  4. Ejecute terraform apply para aprovisionar su nuevo proyecto de Firebase de "puesta en escena" y todos sus recursos y habilitar sus servicios.
  5. Verifique que todo fue aprovisionado y habilitado como se esperaba al verificarlos en la consola Firebase como antes.

12. Paso de bonificación: implementa sus aplicaciones de puesta en escena y prod

  1. En la base de código de su aplicación, cambie el firebase-config.js para usar la configuración de Firebase de su proyecto de estadificación.

    Para recordar cómo obtener su configuración de Firebase y agregarla a su aplicación, consulte el paso anterior de este CodeLab, agregue su configuración de Firebase a su aplicación.
  2. En la raíz de su directorio web , ejecute el siguiente comando para implementar su aplicación en su proyecto Firebase de puesta en escena.
    firebase deploy --only hosting --project=<STAGING_PROJECT_ID>
  3. Abra su aplicación de estadificación en el navegador a través de la URL que está impresa en la salida del firebase deploy . Intente iniciar sesión, enviar mensajes y cargar imágenes.

    Cuando implementa una aplicación en un proyecto Firebase, utiliza recursos reales de Firebase, no recursos emulados. A medida que interactúa con su aplicación de puesta en escena, debe ver que los datos y las imágenes aparezcan en su proyecto de puesta en escena en la consola Firebase.
  4. Después de probar su aplicación en la puesta en escena, cambie el firebase-config.js de nuevo a usar la configuración Firebase del Proyecto Prod (el primer proyecto que creó en este CodeLab).
  5. En la raíz de su directorio web , ejecute el siguiente comando para implementar su aplicación en su proyecto Firebase de producción.
    firebase deploy --only hosting --project=<PRODUCTION_PROJECT_ID>
  6. Abra su aplicación de producción en el navegador a través de la URL que está impresa en la salida del firebase deploy . Intente iniciar sesión, enviar mensajes y cargar imágenes.

    Debería ver que los datos y las imágenes aparecen en su proyecto de producción en la consola Firebase.
  7. Cuando haya terminado de interactuar con las dos aplicaciones para este Codelab, puede evitar que Firebase las sirva. Ejecute el siguiente comando para cada uno de sus proyectos:
    firebase hosting:disable --project=<STAGING_PROJECT_ID>

    firebase hosting:disable --project=<PRODUCTION_PROJECT_ID>

13. ¡Felicitaciones!

¡Has usado Terraform para configurar una aplicación web de chat en tiempo real! Y ha seguido las mejores prácticas para entornos de desarrollo mediante la creación de proyectos de Firebase separados para la puesta en escena y la producción.

Lo que hemos cubierto

  • Uso de la CLI de Terraform para administrar los recursos en la nube
  • Uso de Terraform para configurar los productos Firebase (autenticación, firestore, almacenamiento en la nube y reglas de seguridad)
  • Ejecución y prueba de una aplicación web localmente utilizando la suite de emulador local de Firebase
  • Importar Firebase en una aplicación web
  • Uso de Terraform para replicar una configuración en múltiples entornos

Para obtener más información sobre Firebase y Terraform, visite nuestra documentación . Puede encontrar una lista de todos los productos de Firebase con soporte de Terraform, muestras de configuraciones de Terraform para casos de uso comunes y resolución útil y preguntas frecuentes.