App verbinden und mit dem Prototyping beginnen

Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.

Bevor Sie mit Firebase Local Emulator Suite beginnen, müssen Sie ein Firebase-Projekt erstellen, Ihre Entwicklungsumgebung einrichten und Firebase SDKs für Ihre Plattform gemäß den Themen Einstieg in Firebase für Ihre Plattform auswählen und installieren: Apple, Android oder Web.

Prototypen erstellen und testen

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

Angenommen, Sie arbeiten an einer App, die eine typische Kombination von Produkten verwendet: eine Firebase-Datenbank und Cloud-Funktionen, die durch Vorgänge in dieser Datenbank ausgelöst werden.Local Emulator Suite

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

1. Interaktive Prototypenfunktionen mit den Emulatoren und Emulator Suite UI

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

3. Automatisieren Sie Ihre Tests mit den Emulatoren und benutzerdefinierten Scripts.

Firebase-Projekt lokal initialisieren

Installieren Sie die Befehlszeile oder aktualisieren Sie sie auf die neueste Version.

curl -sL firebase.tools | bash

Wenn Sie es noch nicht getan haben, initialisieren Sie das aktuelle Arbeitsverzeichnis als Firebase-Projekt. 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-Definitiondatei für die Datenbank, ein functions-Verzeichnis mit Cloud Functions-Code und andere unterstützende Dateien.

Interaktive 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. Das ist ein bisschen so, als würde die Firebase-Konsole lokal ausgeführt.

Mit Emulator Suite UI können Sie unter anderem das Design einer Datenbank iterieren, verschiedene Datenflüsse mit Cloud-Funktionen ausprobieren, Änderungen an Sicherheitsregeln bewerten und Protokolle prüfen, um die Leistung Ihrer Back-End-Dienste zu überprüfen. Wenn Sie von vorne beginnen möchten, löschen Sie einfach Ihre Datenbank und beginnen Sie mit einer neuen Designidee.

Sie sind verfügbar, wenn Sie die Local Emulator Suite mit folgenden Befehlen starten:

firebase emulators:start

Für den Prototyp unserer hypothetischen App richten wir eine einfache Cloud-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 sie auszulösen.

1. Erstellen Sie eine Cloud-Funktion, die durch Datenbankschreiben ausgelöst wird, indem Sie die Datei functions/index.js in Ihrem Projektverzeichnis bearbeiten. Ersetzen Sie den Inhalt der vorhandenen Datei durch das folgende Snippet. 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.

  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});
      });
  

2. Starten Sie Local Emulator Suite mit firebase emulators:start. Die Cloud Functions- und Datenbankemulatoren werden gestartet und automatisch für die Interkonnektivität konfiguriert.
3. 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 jedoch die Terminalmeldungen, die von der Firebase-Befehlszeile ausgegeben werden. Notieren Sie sich den Status der verfügbaren Emulatoren. In unserem Fall werden die Cloud Functions- und Cloud Firestore-Emulatoren ausgeführt.
   Hauptseite der Benutzeroberfläche aufrufen
4. Klicken Sie auf der Benutzeroberfläche auf dem Tab Firestore > Daten 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-Funktion ausgelöst. Es wird kurz darauf ein neues uppercase-Feld mit dem String „TEST“ angezeigt.
   So erstellen Sie eine Sammlung Aktualisierungen der Funktion ansehen
5. Prüfen Sie auf dem Tab Firestore > Anfragen die an Ihre emulierte Datenbank gerichteten Anfragen, einschließlich aller Firebase Security Rules Bewertungen, die im Rahmen der Ausführung dieser Anfragen durchgeführt wurden.
6. Prüfen Sie auf dem Tab Protokolle, ob bei der Aktualisierung der Datenbank keine Fehler aufgetreten sind.

Sie können ganz einfach zwischen dem Code Ihrer Cloud-Funktion und interaktiven Datenbankbearbeitungen wechseln, bis Sie den gewünschten Datenfluss erhalten, ohne den Code für den In-App-Datenbankzugriff zu ändern, Test-Suites neu zu kompilieren und noch einmal auszuführen.

App mit den Emulatoren verbinden

Wenn Sie mit dem interaktiven Prototyping gute Fortschritte gemacht haben und sich für ein Design entschieden haben, können Sie Ihrer App mit dem entsprechenden SDK Code für den Datenbankzugriff hinzufügen. Sie verwenden weiterhin den Tab „Datenbank“ und für Funktionen den Tab Protokolle in Emulator Suite UI, um zu prüfen, ob das Verhalten Ihrer App korrekt ist.

Denken Sie daran, dass 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 Daten in die Datenbank schreibt, müssen Sie Ihre Testklassen oder die In-App-Konfiguration auf den Cloud Firestore-Emulator verweisen.

// 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
}
EmulatorSuite.kt

// 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);
EmulatorSuite.java

let settings = Firestore.firestore().settings
settings.host = "127.0.0.1:8080"
settings.cacheSettings = MemoryCacheSettings()
settings.isSSLEnabled = false
Firestore.firestore().settings = settings
ViewController.swift

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

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

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

Tests mit benutzerdefinierten Scripts automatisieren

Jetzt zum letzten Workflowschritt. Sobald Sie einen Prototyp Ihrer In-App-Funktion erstellt haben und dieser auf allen Plattformen vielversprechend aussieht, können Sie mit der endgültigen Implementierung und dem Testen fortfahren. Für Unit-Tests und CI-Workflows können Sie mit dem Befehl exec Emulatoren starten, Skripttests ausführen und Emulatoren in einem einzigen Aufruf beenden:

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

Einzelne Emulatoren genauer kennenlernen

Nachdem Sie nun wissen, wie der grundlegende clientseitige Workflow aussieht, können Sie mit Details zu den einzelnen Emulatoren in der Suite fortfahren, einschließlich der Verwendung für die serverseitige App-Entwicklung:

• Authentication-Emulator zu Ihren Prototyping-Workflows hinzufügen
• Detaillierte Informationen zu den Realtime Database-Emulatorfunktionen
• Detaillierte Informationen zu den Cloud Storage for Firebase-Emulatorfunktionen
• Detaillierte Informationen zu den Cloud Firestore-Emulatorfunktionen
• App mit dem Cloud Functions-Emulator verbinden
• Firebase Extensions mit dem Extensions-Emulator bewerten und gleichzeitig die Abrechnungskosten minimieren

Und jetzt?

Lesen Sie sich die Themen zu den einzelnen Emulatoren durch, die oben verlinkt sind. Gehen Sie anschließend so vor:

• Eine Auswahl an Videos und detaillierten Beispielen finden Sie in der Playlist zum Training von Firebase Emulators.
• Sehen Sie sich erweiterte Anwendungsfälle für Sicherheitsregeln und das Firebase Test SDK an: Sicherheitsregeln testen (Cloud Firestore), Sicherheitsregeln testen (Realtime Database) und Sicherheitsregeln testen (Cloud Storage for Firebase).