Web-Apps lokal mit dem Firebase App Hosting-Emulator testen

Sie können vor der Bereitstellung von App Hosting lokale Tests Ihrer App mit dem App Hosting-Emulator ausführen, der Teil der Firebase Local Emulator Suite ist.

Bevor Sie den App Hosting-Emulator verwenden, sollten Sie sich mit dem gesamten Firebase Local Emulator Suite-Workflow vertraut machen und Local Emulator Suite installieren und konfigurieren sowie die Befehle der Befehlszeile ansehen.

In diesem Thema wird davon ausgegangen, dass Sie mit App Hosting bereits vertraut sind. Sehen Sie sich bei Bedarf die Einführung in App Hosting und andere Materialien an, um mehr über die Funktionsweise von App Hosting zu erfahren.

Was kann ich mit dem App Hosting-Emulator tun?

Mit dem App Hosting-Emulator können Sie Ihre Webanwendungen lokal testen und optimieren. So können Sie Ihren Entwicklungsvorgang optimieren und die Qualität von Webanwendungen verbessern, die mit Firebase erstellt und auf App Hosting bereitgestellt werden.

Der App Hosting-Emulator:

1. Sie können Ihre Webanwendung lokal ausführen, wobei Umgebungsvariablen in apphosting.yaml-Konfigurationsdateien definiert sind.
2. Sie können die in Ihren verschiedenen App Hosting-Umgebungen gespeicherten Secrets exportieren, um Anwendungen in verschiedenen Umgebungen zu simulieren.
3. Kann zusammen mit anderen Firebase-Emulatoren verwendet werden. Wenn Sie den Firestore-, Auth- oder einen anderen Emulator verwenden, sorgt das Local Emulator Suite dafür, dass diese Emulatoren vor dem App Hosting-Emulator gestartet werden.

Emulator konfigurieren

Installieren und initialisieren Sie zuerst das Local Emulator Suite wie unter Local Emulator Suite installieren, konfigurieren und einbinden beschrieben. Außer allen anderen Firebase-Emulatoren, die Sie einrichten möchten, müssen Sie auch App Hosting Emulator auswählen. Sie werden in der Befehlszeile aufgefordert, einige App Hosting-Emulatorwerte anzugeben, darunter:

• Das Stammverzeichnis Ihrer App relativ zum Projekt. Dies ist wichtig, wenn Sie Monorepos mit App Hosting verwenden.
• Ob Sie Geheimnisse für bestimmte Umgebungen exportieren möchten.

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.

Alle Werte, die Sie in diesem Einrichtungsvorgang angeben, werden verwendet, um die App Hosting-Emulatorkonfiguration in firebase.json zu aktualisieren. Sie können den App Hosting-Emulator auch konfigurieren, indem Sie firebase.json direkt aktualisieren. Das Schema für den App-Hosting-Emulator lautet:

{
  ...
  "emulators": {
    "apphosting": {
      "startCommandOverride": <command> [optional]
      "rootDirectory": <path> [optional]
      }
    }
  }

• startCommandOverride wird automatisch generiert und festgelegt, wenn der Emulator initialisiert wird. Wenn Sie keinen Befehl angeben, erkennt der Emulator den Befehl „dev“ Ihres Paketmanagers und führt ihn aus.
• rootDirectory wird für die Unterstützung von Monorepo-Projektkonfigurationen verwendet. Wenn sich Ihre Webanwendung in einem Unterverzeichnis befindet, müssen Sie den Pfad dieses Verzeichnisses relativ zum Stammverzeichnis (dem Speicherort von firebase.json) angeben.

Emulation verwalten

Bei der Emulatorinitialisierung wird eine apphosting.local.yaml-Datei im Stammverzeichnis Ihrer App erstellt. Diese Konfigurationsdatei hat dasselbe Schema wie die Datei apphosting.yaml, die in der Produktion verwendet wird, ist aber ausschließlich für die lokale Entwicklung gedacht. Standardmäßig liest der Emulator die Konfiguration aus der apphosting.yaml-Datei. Wenn jedoch eine apphosting.local.yaml-Datei vorhanden ist, werden die Konfigurationen in dieser Datei priorisiert und haben Vorrang.

Secrets exportieren, um lokal verschiedene Umgebungen zu simulieren

Wenn Sie mit mehreren Umgebungen arbeiten und lokal unterschiedliche App-Umgebungen simulieren möchten, benötigen Sie möglicherweise die Secrets der entsprechenden Umgebungen. Sie können Secrets für eine bestimmte Umgebung mit dem Befehl apphosting:config:export exportieren. Alternativ können Sie wie unter Emulator konfigurieren beschrieben auch Secrets während der Emulatorinitialisierung importieren.

Für diesen Befehl müssen Sie eine der verfügbaren App Hosting-Umgebungen Ihres Projekts auswählen. Die umgebungsspezifische App Hosting-Konfiguration (z. B. „apphosting.staging.yaml“) und die BasisApp Hosting-Konfiguration („apphosting.yaml“) werden zusammengeführt. Dabei hat die umgebungsspezifische Konfiguration Vorrang. Wenn in beiden Konfigurationen Secrets mit demselben Namen vorhanden sind, wird das Secret aus der umgebungsspezifischen Konfiguration verwendet.

So exportieren Sie beispielsweise Secrets aus einer Staging-Umgebung in den Emulator:

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.

Die Datei apphosting.local.yaml wird mit den exportierten Secrets als Umgebungsvariablen aktualisiert (oder erstellt, falls sie noch nicht vorhanden ist). Da die Datei jetzt vertrauliche Informationen im Klartext enthält, wird sie automatisch Ihrer .gitignore-Datei hinzugefügt, um zu verhindern, dass sie versehentlich in Ihr Quellcode-Repository committet wird.

Emulator starten

firebase emulators:start

Dadurch werden alle in der Datei firebase.json definierten Emulatoren gestartet, einschließlich des App Hosting-Emulators.