App verbinden und mit dem Prototyping beginnen


Bevor Sie mit Firebase Local Emulator Suite loslegen, müssen Sie ein Firebase-Projekt erstellt, Ihre Entwicklungsumgebung eingerichtet und die Firebase SDKs für Ihre Plattform ausgewählt und installiert haben. Informationen dazu finden Sie in den Themen unter Erste Schritte mit Firebase für Ihre Plattform: Apple, Android oder Web.

Prototyp erstellen und testen

Die Local Emulator Suite enthält mehrere Produktemulatoren, wie in Einführung in Firebase Local Emulator Suite beschrieben. Sie können Prototypen mit einzelnen Emulatoren sowie mit Kombinationen von Emulatoren erstellen und testen, je nachdem, welche Firebase-Produkte Sie in der Produktion verwenden.

Interaktion zwischen Firebase-Datenbank- und Functions-Emulatoren
Datenbank- und Cloud Functions Emulatoren als Teil der vollständigen Local Emulator Suite.

In diesem Thema wird der Local Emulator Suite Workflow anhand einer App mit einer typischen Kombination von Produkten erläutert: einer Firebase Datenbank und Cloud Functions, die durch Vorgänge in dieser Datenbank ausgelöst werden.

Nachdem Sie Ihr Firebase-Projekt lokal initialisiert haben, besteht der Entwicklungszyklus mit Local Emulator Suite in der Regel aus drei Schritten:

  1. Funktionen interaktiv mit den Emulatoren und Emulator Suite UI prototypisieren.

  2. Wenn Sie einen Datenbankemulator oder den Cloud Functions Emulator verwenden, müssen Sie einmalig Ihre App mit den Emulatoren verbinden.

  3. Tests mit den Emulatoren und benutzerdefinierten Skripts automatisieren.

Firebase-Projekt lokal initialisieren

Stellen Sie sicher, dass Sie die CLI installieren oder auf die neueste Version aktualisieren.

curl -sL firebase.tools | bash

Falls noch nicht geschehen, initialisieren Sie das aktuelle Arbeitsverzeichnis als ein Firebase-Projekt und folgen Sie der Anleitung auf dem Bildschirm, um anzugeben, dass Sie Cloud Functions und entweder Cloud Firestore oder Realtime Database verwenden:

firebase init

Ihr Projektverzeichnis enthält jetzt Firebase-Konfigurationsdateien, eine Firebase Security Rules Definitionsdatei für die Datenbank, ein functions Verzeichnis mit Cloud Functions-Code und andere unterstützende Dateien.

Interaktiv Prototypen erstellen

Local Emulator Suite wurde entwickelt, damit Sie schnell Prototypen für neue Funktionen erstellen können. Die integrierte Benutzeroberfläche der Suite ist eines der nützlichsten Prototyping- Tools. Es ist so, als ob Sie die Firebase Konsole lokal ausführen.

Mit Emulator Suite UI können Sie das Design einer Datenbank iterieren, verschiedene Datenflüsse mit Cloud Functions ausprobieren, Änderungen an Sicherheitsregeln bewerten und Logs prüfen, um die Leistung Ihrer Back-End-Dienste zu bestätigen. Wenn Sie neu beginnen möchten, löschen Sie einfach Ihre Datenbank und starten Sie mit einer neuen Designidee.

All das ist verfügbar, wenn Sie die Local Emulator Suite mit folgendem Befehl starten:

firebase emulators:start

Um einen Prototyp für unsere hypothetische App zu erstellen, richten wir eine einfache Cloud Functions-Funktion ein und testen sie um Texteinträge in einer Datenbank zu ändern. Außerdem erstellen und füllen wir diese Datenbank in der Emulator Suite UI um die Funktion auszulösen.

  1. Erstellen Sie eine Cloud Functions-Funktion, die durch Datenbankschreibvorgänge ausgelöst wird, indem Sie die functions/index.js Datei in Ihrem Projektverzeichnis bearbeiten. Ersetzen Sie den Inhalt der vorhandenen Datei durch den folgenden Code. Diese Funktion überwacht Änderungen an Dokumenten in der Sammlung messages, wandelt den Inhalt des Felds original eines Dokuments in Großbuchstaben um und speichert das Ergebnis im Feld uppercase dieses Dokuments.
  2.   const functions = require('firebase-functions/v1');
    
      exports.makeUppercase = functions.firestore.document('/messages/{documentId}')
          .onCreate((snap, context) => {
            const original = snap.data().original;
            console.log('Uppercasing', context.params.documentId, original);
            const uppercase = original.toUpperCase();
            return snap.ref.set({uppercase}, {merge: true});
          });
      
  3. Starten Sie die Local Emulator Suite mit firebase emulators:start. Die Cloud Functions und Datenbank Emulatoren werden gestartet und automatisch für die Zusammenarbeit konfiguriert.
  4. Rufen Sie die Benutzeroberfläche in Ihrem Browser unter http://localhost:4000 auf. Port 4000 ist der Standardport für die Benutzeroberfläche. Prüfen Sie aber die Terminalmeldungen, die von der Firebase CLI ausgegeben werden. Beachten Sie den Status der verfügbaren Emulatoren. In unserem Fall werden die Cloud Functions und Cloud Firestore Emulatoren ausgeführt.
    Durch mein Bild
  5. Klicken Sie auf der Benutzeroberfläche auf dem Tab Firestore > Data auf Sammlung starten und folgen Sie der Anleitung, um ein neues Dokument in einer messages Sammlung mit dem Feldnamen original und dem Wert test zu erstellen. Dadurch wird unsere Cloud Functions-Funktion ausgelöst. Kurz darauf wird ein neues uppercase Feld mit dem String "TEST" angezeigt.
    Durch mein Bild Durch mein Bild
  6. Auf dem Tab Firestore > Anfragen können Sie die Anfragen an Ihre emulierte Datenbank untersuchen, einschließlich aller Firebase Security Rules Auswertungen, die im Rahmen der Bearbeitung dieser Anfragen durchgeführt wurden.
  7. Prüfen Sie auf dem Tab Logs , ob bei der Aktualisierung der Datenbank keine Fehler aufgetreten sind.

Sie können ganz einfach zwischen Ihrem Cloud Functions-Code und interaktiven Datenbankbearbeitungen wechseln, bis Sie den gewünschten Datenfluss erhalten, ohne den Datenbankzugriffscode in der App zu ändern, Testsuiten neu zu kompilieren und auszuführen.

App mit den Emulatoren verbinden

Wenn Sie mit dem interaktiven Prototyping gute Fortschritte gemacht und sich für ein Design entschieden haben, können Sie Ihrer App mit dem entsprechenden SDK Datenbankzugriffscode hinzufügen. Sie verwenden weiterhin den Tab „Datenbank“ und für Funktionen den Logs Tab in Emulator Suite UI, um zu bestätigen, dass sich Ihre App korrekt verhält.

Denken Sie daran, dass das Local Emulator Suite ein lokales Entwicklungstool ist. Schreibvorgänge in Ihre Produktionsdatenbanken lösen keine Funktionen aus, die Sie lokal prototypisieren.

Wenn Sie möchten, dass Ihre App Schreibvorgänge in die Datenbank ausführt, müssen Sie Ihre Testklassen oder die In-App-Konfiguration auf den Cloud Firestore Emulator verweisen.

Kotlin
// 10.0.2.2 is the special IP address to connect to the 'localhost' of
// the host computer from an Android emulator.
val firestore = Firebase.firestore
firestore.useEmulator("10.0.2.2", 8080)

firestore.firestoreSettings = firestoreSettings {
    isPersistenceEnabled = false
}
Java
// 10.0.2.2 is the special IP address to connect to the 'localhost' of
// the host computer from an Android emulator.
FirebaseFirestore firestore = FirebaseFirestore.getInstance();
firestore.useEmulator("10.0.2.2", 8080);

FirebaseFirestoreSettings settings = new FirebaseFirestoreSettings.Builder()
        .setPersistenceEnabled(false)
        .build();
firestore.setFirestoreSettings(settings);
Swift
let settings = Firestore.firestore().settings
settings.host = "127.0.0.1:8080"
settings.cacheSettings = MemoryCacheSettings()
settings.isSSLEnabled = false
Firestore.firestore().settings = settings

Web

import { getFirestore, connectFirestoreEmulator } from "firebase/firestore";

// firebaseApps previously initialized using initializeApp()
const db = getFirestore();
connectFirestoreEmulator(db, '127.0.0.1', 8080);

Web

// Firebase previously initialized using firebase.initializeApp().
var db = firebase.firestore();
if (location.hostname === "localhost") {
  db.useEmulator("127.0.0.1", 8080);
}

Tests mit benutzerdefinierten Skripts automatisieren

Nun zum letzten Schritt des Workflows. Nachdem Sie Ihre Funktion in der App prototypisiert haben und sie auf allen Plattformen vielversprechend aussieht, können Sie mit der endgültigen Implementierung und dem Testen fortfahren. Für Einheitentests und CI-Workflows können Sie Emulatoren starten, Skripttests ausführen und Emulatoren mit einem einzigen Aufruf mit dem Befehl exec herunterfahren:

firebase emulators:exec "./testdir/test.sh"

Einzelne Emulatoren genauer ansehen

Nachdem Sie nun den grundlegenden clientseitigen Workflow kennengelernt haben, können Sie sich die Details zu den einzelnen Emulatoren in der Suite ansehen, einschließlich der Verwendung für die serverseitige App-Entwicklung:

Nächste Schritte

Lesen Sie die oben verlinkten Themen zu den einzelnen Emulatoren. Gehen Sie anschließend so vor: