使用 Firebase App Hosting 模拟器在本地测试 Web 应用

您可以在 App Hosting 部署之前使用 App Hosting 模拟器(属于 Firebase Local Emulator Suite 的一部分)对应用执行本地测试。

在使用 App Hosting 模拟器之前,请确保您了解 Firebase Local Emulator Suite 的整体工作流,而且已安装和配置 Local Emulator Suite 并已查看其 CLI 命令

本主题假设您已熟悉 App Hosting。如有需要,请查看 App Hosting 简介和其他材料,以帮助您了解 App Hosting 的运作方式

App Hosting 模拟器的用途

借助 App Hosting 模拟器,您可以在本地测试和优化 Web 应用。这可以简化开发流程,并提升使用 Firebase 构建并部署在 App Hosting 上的 Web 应用的质量。

App Hosting 模拟器:

  1. 让您能够在本地运行 Web 应用,并使用 apphosting.yaml 配置文件中定义的环境变量。
  2. 可以导出您保存在不同 App Hosting 环境中的 Secret,以便您在不同环境中模拟应用。
  3. 可与其他 Firebase 模拟器搭配使用。如果您使用的是 Firestore、Auth 或任何其他模拟器,Local Emulator Suite 会确保先启动这些模拟器,然后再启动 App Hosting 模拟器。

配置模拟器

首先,请按照安装、配置和集成 Local Emulator Suite 中所述的方式安装和初始化 Local Emulator Suite。除了要设置的任何其他 Firebase 模拟器之外,请务必选择 App Hosting Emulator。CLI 会提示您输入一些 App Hosting 模拟器值,包括:

firebase init emulators
=== Emulators Setup
? Which Firebase emulators do you want to set up? Press Space to select emulators, then Enter to confirm your choices. (Press
<space> to select, <a> to toggle all, <i> to invert selection, and <enter> to proceed)
❯◯ App Hosting Emulator
 ◯ Firestore Emulator
 ◯ Database Emulator
 ◯ Hosting Emulator
 ◯ Pub/Sub Emulator
 ◯ Storage Emulator
 ◯ Eventarc Emulator
(Move up and down to reveal more choices)

? Specify your app's root directory relative to your project (.)

? What configs would you like to export? (Press
<space> to select, <a> to toggle all, <i> to invert selection, and <enter> to proceed)
 ❯◯ Secrets

? Which environment would you like to export secrets from Secret Manager for?:
  ◯ base (apphosting.yaml)
 ❯◯ staging (apphosting.yaml + apphosting.staging.yaml)
  ◯ preview (apphosting.yaml + apphosting.preview.yaml)

i Wrote Secrets as environment variables to apphosting.local.yaml.
i apphosting.local.yaml has been automatically added to your .gitignore.

您在此设置流程中提供的所有值都将用于更新 firebase.json 中的 App Hosting 模拟器配置。您还可以通过直接更新 firebase.json 来配置 App Hosting 模拟器。App Hosting 模拟器的架构如下所示:

{
  ...
  "emulators": {
    "apphosting": {
      "startCommandOverride": <command> [optional]
      "rootDirectory": <path> [optional]
      }
    }
  }
  • 在模拟器初始化时,系统会自动生成并设置 startCommandOverride。如果未提供,模拟器将检测并运行软件包管理器的开发者命令。
  • rootDirectory 用于支持 monorepo 项目设置。如果您的 Web 应用位于子目录中,您需要提供该目录相对于根目录(firebase.json 的位置)的路径。

管理模拟

模拟器初始化会在应用的根目录中创建一个 apphosting.local.yaml 文件。此配置文件的架构与生产环境中使用的 apphosting.yaml 文件相同,但仅适用于本地开发。默认情况下,模拟器会从 apphosting.yaml 文件读取配置,但如果存在 apphosting.local.yaml 文件,则该文件中的配置会被优先处理并具有优先级。

导出密钥以在本地模拟不同的环境

如果您使用的是多个环境,并且希望在本地模拟不同的应用环境,则可能需要相应环境的密钥。您可以使用 CLI 命令 apphosting:config:export 为特定环境导出 Secret(或者,如配置模拟器中所示,您也可以选择在模拟器初始化期间导入 Secret)。

执行此命令时,您需要从项目的可用 App Hosting 环境中进行选择。系统会合并特定于环境的 App Hosting 配置(例如“apphosting.staging.yaml”)和基础 App Hosting 配置(“apphosting.yaml”),其中特定于环境的配置优先。如果这两个配置中都存在名称相同的 Secret,则系统会使用特定于环境的配置中的 Secret。

例如,如需将 Secret 从预演环境导出到模拟器,请执行以下操作:

firebase apphosting:config:export --project <your firebase project Id>

? What configs would you like to export? (Press
<space> to select, <a> to toggle all, <i> to invert selection, and <enter> to proceed)
 ❯◯ Secrets

? Which environment would you like to export secrets from Secret Manager for?:
  ◯ base (apphosting.yaml)
 ❯◯ staging (apphosting.yaml + apphosting.staging.yaml)
  ◯ preview (apphosting.yaml + apphosting.preview.yaml)
i Wrote Secrets as environment variables to apphosting.local.yaml.
i apphosting.local.yaml has been automatically added to your .gitignore.

系统会将导出的密文作为环境变量更新(或创建)您的 apphosting.local.yaml 文件。由于该文件现在包含纯文本形式的敏感信息,因此系统会自动将其添加到 .gitignore 文件,以防止其意外提交到源代码代码库。

运行模拟器

firebase emulators:start

这将启动 firebase.json 文件中定义的所有模拟器,包括 App Hosting 模拟器。