Połącz aplikację i rozpocznij prototyp


Zanim zaczniesz korzystać z Firebase Local Emulator Suite, utwórz projekt Firebase, skonfiguruj środowisko programistyczne oraz wybierz i zainstaluj pakiety SDK Firebase na swoją platformę zgodnie z tematami z sekcji Pierwsze kroki z Firebase dotyczącymi Twojej platformy: Apple, Android lub Web.

Prototypowanie i testowanie

Local Emulator Suite zawiera kilka emulatorów produktów, które zostały opisane w artykule Wprowadzenie do Firebase Local Emulator Suite. Możesz tworzyć prototypy i testować je na poszczególnych emulatorach oraz na ich kombinacjach, w zależności od tego, których usług Firebase używasz w wersji produkcyjnej.

Interakcja między emulatorem bazy danych Firebase a emulatorem funkcji
Bazy danych i emulatory Cloud Functions w ramach pełnej Local Emulator Suite.

Aby wprowadzić Cię w temat Local Emulator Suite, załóżmy, że pracujesz nad aplikacją, która korzysta z typowego połączenia usług: bazy danych Firebase i funkcji Cloud Functions wywoływanych przez operacje w tej bazie danych.

Po zainicjowaniu lokalnie projektu Firebase cykl programowania z użyciem Local Emulator Suite zwykle składa się z 3 etapów:

  1. Twórz interaktywne prototypy funkcji za pomocą emulatorów i Emulator Suite UI.

  2. Jeśli używasz emulatora bazy danych lub emulatora Cloud Functions, wykonaj jednorazową czynność, aby połączyć aplikację z emulatorami.

  3. Automatyzuj testy za pomocą emulatorów i skryptów niestandardowych.

Lokalne inicjowanie projektu Firebase

Zainstaluj interfejs wiersza poleceń lub zaktualizuj go do najnowszej wersji.

curl -sL firebase.tools | bash

Jeśli jeszcze tego nie zrobiono, zainicjuj bieżący katalog roboczy jako projekt Firebase. Postępuj zgodnie z instrukcjami wyświetlanymi na ekranie, aby określić, że używasz Cloud Functions oraz Cloud Firestore lub Realtime Database:

firebase init

Katalog projektu będzie teraz zawierać pliki konfiguracyjne Firebase, plik definicji bazy danychFirebase Security Rules, katalogfunctions z kodem funkcji w chmurze i inne pliki pomocnicze.

Interaktywne prototypowanie

Local Emulator Suite umożliwia szybkie tworzenie prototypów nowych funkcji, a wbudowany interfejs pakietu jest jednym z najbardziej przydatnych narzędzi do prototypowania. To trochę tak, jakby Firebase konsola działała lokalnie.

Za pomocą Emulator Suite UI możesz iteracyjnie projektować bazę danych, wypróbowywać różne przepływy danych z użyciem funkcji Cloud Functions, oceniać zmiany w regułach zabezpieczeń, sprawdzać logi, aby potwierdzić wydajność usług backendu, i wykonywać inne czynności. Jeśli chcesz zacząć od nowa, wyczyść bazę danych i zacznij od początku z nowym pomysłem na projekt.

Wszystkie te funkcje są dostępne, gdy uruchomisz Local Emulator Suite za pomocą:

firebase emulators:start

Aby stworzyć prototyp hipotetycznej aplikacji, skonfigurujmy i przetestujmy podstawową funkcję chmurową, która będzie modyfikować wpisy tekstowe w bazie danych, a także tworzyć i wypełniać tę bazę danych w Emulator Suite UI, aby ją wywoływać.

  1. Utwórz funkcję w Cloud Functions aktywowaną przez zapisy w bazie danych, edytując plik functions/index.js w katalogu projektu. Zastąp zawartość istniejącego pliku tym fragmentem kodu. Ta funkcja nasłuchuje zmian w węzłach w hierarchii messages, konwertuje zawartość właściwości original węzła na wielkie litery i zapisuje wynik we właściwości uppercase tego węzła.
    2.   const functions = require('firebase-functions/v1');

  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);
      });
  2. Uruchom Local Emulator Suite za pomocą firebase emulators:start. Emulatory Cloud Functions i bazy danych uruchamiają się automatycznie i są skonfigurowane do współpracy.
  3. Wyświetl interfejs w przeglądarce pod adresem http://localhost:4000. Port 4000 jest domyślnym portem interfejsu, ale sprawdź komunikaty terminala wygenerowane przez interfejs wiersza poleceń Firebase. Sprawdź stan dostępnych emulatorów. W naszym przypadku będą działać emulatory Cloud Functions i Realtime Database.
    Moje zdjęcie
  4. W interfejsie na karcie Baza danych czasu rzeczywistego użyj elementów sterujących edytora zawartości bazy danych, aby utworzyć zestaw węzłów z węzłem messages zawierającym węzeł message1, który z kolei zawiera węzeł z kluczem ustawionym na original i wartością ustawioną na test. To aktywuje naszą funkcję w Cloud Functions. Zauważ, że wkrótce pojawi się nowa właściwość uppercase o wartości TEST.
    Moje zdjęcie Moje zdjęcie
  5. Sprawdź kartę Dzienniki, aby upewnić się, że funkcja nie spowodowała błędów podczas aktualizowania bazy danych.

Możesz łatwo przełączać się między kodem funkcji w chmurze a interaktywnymi zmianami w bazie danych, aż uzyskasz oczekiwany przepływ danych, bez konieczności modyfikowania kodu dostępu do bazy danych w aplikacji, ponownego kompilowania i uruchamiania pakietów testowych.

Łączenie aplikacji z emulatorami

Gdy osiągniesz postępy w tworzeniu interaktywnego prototypu i ustalisz projekt, możesz dodać do aplikacji kod dostępu do bazy danych za pomocą odpowiedniego pakietu SDK. Nadal będziesz używać karty bazy danych, a w przypadku funkcji – karty Dzienniki w Emulator Suite UI, aby potwierdzić, że aplikacja działa prawidłowo.

Pamiętaj, że Local Emulator Suite to narzędzie do programowania lokalnego. Zapisywanie danych w bazach danych produkcyjnych nie będzie wywoływać funkcji, które testujesz lokalnie.

Aby przełączyć aplikację na zapisywanie danych w bazie danych, musisz skierować klasy testowe lub konfigurację w aplikacji na emulator Realtime Database.

Kotlin
// 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)
EmulatorSuite.kt
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);
EmulatorSuite.java
Swift
    // In almost all cases the ns (namespace) is your project ID.
let db = Database.database(url:"http://127.0.0.1:9000?ns=YOUR_DATABASE_NAMESPACE")
ViewController.swift

Web

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

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

Web

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

Automatyzowanie testów za pomocą skryptów niestandardowych

Teraz przejdźmy do ostatniego kroku całego procesu. Gdy prototyp funkcji w aplikacji będzie wyglądać obiecująco na wszystkich platformach, możesz przejść do ostatecznego wdrożenia i testowania. W przypadku testów jednostkowych i procesów CI możesz uruchamiać emulatory, przeprowadzać testy skryptowe i zamykać emulatory za pomocą jednego wywołania z użyciem polecenia exec:

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

Szczegółowe informacje o poszczególnych emulatorach

Znasz już podstawowy przepływ pracy po stronie klienta. Teraz możesz zapoznać się ze szczegółami dotyczącymi poszczególnych emulatorów w pakiecie, w tym z informacjami o tym, jak używać ich do tworzenia aplikacji po stronie serwera:

Co dalej?

Zapoznaj się z tematami dotyczącymi konkretnych emulatorów, do których linki znajdziesz powyżej. Następnie: