Firebase is back at Google I/O on May 10! Register now

Verbinden Sie Ihre App und beginnen Sie mit dem Prototyping

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

Bevor Sie mit der Firebase Local Emulator Suite loslegen, vergewissern Sie sich, dass Sie ein Firebase-Projekt erstellt, Ihre Entwicklungsumgebung eingerichtet und Firebase-SDKs für Ihre Plattform gemäß den Themen Erste Schritte mit Firebase für Ihre Plattform ausgewählt und installiert haben: Apple , Android oder Web .

Prototyp und Test

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

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

Um den Local Emulator Suite-Workflow in diesem Thema vorzustellen, gehen wir davon aus, dass Sie an einer App arbeiten, die eine typische Kombination von Produkten verwendet: eine Firebase-Datenbank und Cloud-Funktionen, die durch Vorgänge in dieser Datenbank ausgelöst werden.

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

  1. Prototypfunktionen interaktiv mit den Emulatoren und der Benutzeroberfläche der Emulator Suite.

  2. Wenn Sie einen Datenbankemulator oder den Cloud Functions-Emulator verwenden, führen Sie einen einmaligen Schritt aus, um Ihre App mit den Emulatoren zu verbinden.

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

Initialisieren Sie lokal ein Firebase-Projekt

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

curl -sL firebase.tools | bash

Falls Sie dies noch nicht getan haben, initialisieren Sie das aktuelle Arbeitsverzeichnis als Firebase-Projekt, indem Sie den Eingabeaufforderungen auf dem Bildschirm folgen, um anzugeben, dass Sie Cloud Functions und entweder Cloud Firestore oder Realtime Database verwenden:

firebase init

Ihr Projektverzeichnis enthält jetzt Firebase-Konfigurationsdateien, eine Definitionsdatei für Firebase-Sicherheitsregeln für die Datenbank, ein functions mit Cloud-Funktionscode und andere unterstützende Dateien.

Prototypen interaktiv

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

Mit der Benutzeroberfläche der Emulator Suite können Sie das Design einer Datenbank iterieren, verschiedene Datenflüsse mit Cloud-Funktionen ausprobieren, Änderungen an Sicherheitsregeln auswerten, Protokolle überprüfen, um die Leistung Ihrer Back-End-Dienste zu bestätigen, und vieles mehr. Wenn Sie dann noch einmal von vorn beginnen möchten, leeren Sie einfach Ihre Datenbank und beginnen Sie mit einer neuen Designidee neu.

Es ist alles verfügbar, wenn Sie die Local Emulator Suite starten mit:

firebase emulators:start

Um einen Prototyp unserer hypothetischen App zu erstellen, richten wir eine grundlegende Cloud-Funktion ein und testen sie, um Texteinträge in einer Datenbank zu ändern, und erstellen und füllen diese Datenbank in der Benutzeroberfläche der Emulator Suite, um sie auszulösen.

  1. Erstellen Sie eine Cloud-Funktion, die durch Datenbankschreibvorgänge 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 wartet auf Änderungen an Knoten in der messages , wandelt den Inhalt der original Eigenschaft des Knotens in Großbuchstaben um und speichert das Ergebnis in der uppercase dieses Knotens.
  2.   const functions = require('firebase-functions');
    
      exports.makeUppercase = functions.database.ref('/messages/{pushId}/original')
          .onCreate((snapshot, context) => {
            const original = snapshot.val();
            console.log('Uppercasing', context.params.pushId, original);
            const uppercase = original.toUpperCase();
            return snapshot.ref.parent.child('uppercase').set(uppercase);
          });
      
  3. Starten Sie die Local Emulator Suite mit firebase emulators:start . Die Cloud-Funktionen und Datenbankemulatoren werden gestartet und automatisch für die Zusammenarbeit konfiguriert.
  4. Zeigen Sie die Benutzeroberfläche in Ihrem Browser unter http://localhost:4000 an. Port 4000 ist der Standardwert für die Benutzeroberfläche, aber überprüfen Sie die Terminalnachrichten, die von der Firebase-CLI ausgegeben werden. Beachten Sie den Status verfügbarer Emulatoren. In unserem Fall werden die Emulatoren Cloud Functions und Realtime Database ausgeführt.
    Mein Bild
  5. Verwenden Sie in der Benutzeroberfläche auf der Registerkarte „Echtzeitdatenbank“ die Steuerelemente des Datenbankinhaltseditors, um eine Gruppe von Knoten mit einem messages zu erstellen, der einen message1 Knoten enthält, der wiederum einen Knoten enthält, dessen Schlüssel auf „ original “ und der Wert auf „ test festgelegt ist. Dies löst unsere Cloud-Funktion aus. Beachten Sie, dass in Kürze eine neue uppercase mit dem Wert TEST erscheint.
    Mein BildMein Bild
  6. Überprüfen Sie die Registerkarte Protokolle, um zu bestätigen, dass Ihre Funktion beim Aktualisieren der Datenbank keine Fehler ausgeführt hat.

Sie können problemlos zwischen Ihrem Cloud-Funktionscode und interaktiven Datenbankbearbeitungen iterieren, bis Sie den gewünschten Datenfluss erhalten, ohne den Datenbankzugriffscode in der App zu berühren, Testsuiten neu zu kompilieren und erneut auszuführen.

Verbinden Sie Ihre App mit den Emulatoren

Wenn Sie beim 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 die Registerkarte "Datenbank" und für Funktionen die Registerkarte " Protokolle " in der Emulator Suite-Benutzeroberfläche, um zu bestätigen, dass das Verhalten Ihrer App korrekt ist.

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

Um dazu überzugehen, dass Ihre App in die Datenbank schreibt, müssen Sie Ihre Testklassen oder In-App-Konfiguration auf den Realtime Database-Emulator verweisen.

Kotlin+KTX
// 10.0.2.2 is the special IP address to connect to the 'localhost' of
// the host computer from an Android emulator.
val database = Firebase.database
database.useEmulator("10.0.2.2", 9000)
Java
// 10.0.2.2 is the special IP address to connect to the 'localhost' of
// the host computer from an Android emulator.
FirebaseDatabase database = FirebaseDatabase.getInstance();
database.useEmulator("10.0.2.2", 9000);
Schnell
    // In almost all cases the ns (namespace) is your project ID.
let db = Database.database(url:"http://localhost:9000?ns=YOUR_DATABASE_NAMESPACE")

Web version 9

import { getDatabase, connectDatabaseEmulator } from "firebase/database";

const db = getDatabase();
if (location.hostname === "localhost") {
  // Point to the RTDB emulator running on localhost.
  connectDatabaseEmulator(db, "localhost", 9000);
} 

Web version 8

var db = firebase.database();
if (location.hostname === "localhost") {
  // Point to the RTDB emulator running on localhost.
  db.useEmulator("localhost", 9000);
} 

Automatisieren Sie Ihre Tests mit benutzerdefinierten Skripten

Nun zum letzten Gesamt-Workflow-Schritt. Sobald Sie Ihr In-App-Feature als Prototyp erstellt haben und es auf allen Ihren Plattformen vielversprechend aussieht, können Sie sich der endgültigen Implementierung und dem Test zuwenden. Für Komponententests und CI-Workflows können Sie Emulatoren starten, Skripttests ausführen und Emulatoren in einem einzigen Aufruf mit dem Befehl exec herunterfahren:

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

Erkunden Sie einzelne Emulatoren genauer

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

Was als nächstes?

Lesen Sie unbedingt die oben verlinkten Themen zu bestimmten Emulatoren. Dann: