Prototypuj i testuj aplikacje internetowe za pomocą emulatora hostingu Firebase

Zanim zaczniesz prototypować i testować aplikację internetową za pomocą emulatora Firebase Hosting, upewnij się, że rozumiesz ogólny przepływ pracy w pakiecie Firebase Local Emulator Suite oraz że instalujesz i konfigurujesz pakiet Local Emulator Suite oraz przeglądasz jego polecenia CLI .

Powinieneś także zapoznać się z funkcjami i procesem wdrażania Firebase Hosting. Zacznij od wprowadzenia do Hostingu Firebase .

Co mogę zrobić z emulatorem Firebase Hosting?

Emulator Firebase Hosting zapewnia wysokiej jakości lokalną emulację usług hostingowych, zapewniając wiele funkcji dostępnych w hostingu produkcyjnym . Emulator Hostingu umożliwia:

  • Prototypuj swoje statyczne witryny i aplikacje internetowe bez ponoszenia opłat za miejsce i dostęp
  • Prototypuj, testuj i debuguj funkcje HTTPS przed wdrożeniem w witrynie hostingowej
  • Testuj witryny i aplikacje internetowe w konteneryzowanych procesach ciągłej integracji.

Wybierz projekt Firebase

Pakiet Firebase Local Emulator Suite emuluje produkty dla pojedynczego projektu Firebase.

Aby wybrać projekt do użycia, przed uruchomieniem emulatorów, w CLI uruchom firebase use w swoim katalogu roboczym. Możesz też przekazać flagę --project do każdego polecenia emulatora.

Local Emulator Suite obsługuje emulację prawdziwych projektów Firebase i projektów demonstracyjnych .

Typ projektu Cechy Używaj z emulatorami
Prawdziwy

Prawdziwy projekt Firebase to taki, który utworzyłeś i skonfigurowałeś (najprawdopodobniej za pomocą konsoli Firebase).

Prawdziwe projekty mają aktywne zasoby, takie jak instancje baz danych, zasobniki pamięci, funkcje lub inne zasoby skonfigurowane dla tego projektu Firebase.

Pracując z prawdziwymi projektami Firebase, możesz uruchomić emulatory dla dowolnego lub wszystkich obsługiwanych produktów.

W przypadku wszystkich produktów, których nie emulujesz, Twoje aplikacje i kod będą wchodzić w interakcję z aktywnym zasobem (instancją bazy danych, zasobnikiem pamięci, funkcją itp.).

Próbny

Projekt demonstracyjny Firebase nie ma prawdziwej konfiguracji Firebase ani aktywnych zasobów. Dostęp do tych projektów można zwykle uzyskać za pośrednictwem ćwiczeń z programowania lub innych samouczków.

Identyfikatory projektów demonstracyjnych mają przedrostek demo- .

 Podczas pracy z projektami demonstracyjnymi Firebase Twoje aplikacje i kod wchodzą w interakcję wyłącznie z emulatorami. Jeśli aplikacja podejmie próbę interakcji z zasobem, dla którego nie działa emulator, wykonanie kodu zakończy się niepowodzeniem.

W miarę możliwości zalecamy korzystanie z projektów demonstracyjnych. Korzyści obejmują:

  • Łatwiejsza konfiguracja, ponieważ możesz uruchomić emulatory bez tworzenia projektu Firebase
  • Większe bezpieczeństwo, ponieważ jeśli Twój kod przypadkowo wywoła nieemulowane zasoby (produkcyjne), nie ma szans na zmianę danych, wykorzystanie i rozliczenie
  • Lepsza obsługa w trybie offline, ponieważ nie ma potrzeby dostępu do Internetu, aby pobrać konfigurację SDK.

Podstawowy proces prototypowania

Jeśli wykonujesz szybkie iteracje lub chcesz, aby Twoja aplikacja współdziałała z emulowanymi zasobami projektu zaplecza, możesz przetestować zawartość i konfigurację hostingu lokalnie. Podczas testowania lokalnego Firebase udostępnia Twoją aplikację internetową pod lokalnie hostowanym adresem URL.

  1. (Opcjonalnie) Domyślnie aplikacja hostowana lokalnie będzie wchodzić w interakcję z rzeczywistymi , a nie emulowanymi zasobami projektu (funkcjami, bazą danych, regułami itp.). Zamiast tego możesz opcjonalnie połączyć swoją aplikację, aby korzystać ze skonfigurowanych emulowanych zasobów projektu. Dowiedz się więcej: Baza danych czasu rzeczywistego | Chmura Firestore | Funkcje chmury

  2. W katalogu głównym lokalnego katalogu projektu uruchom następującą komendę:

    firebase emulators:start

  3. Otwórz aplikację internetową pod lokalnym adresem URL zwróconym przez interfejs CLI (zwykle http://localhost:5000 ).

  4. Aby zaktualizować lokalny adres URL zmianami, odśwież przeglądarkę.

Przetestuj z innych urządzeń lokalnych

Domyślnie emulatory odpowiadają tylko na żądania z localhost . Oznacza to, że będziesz mieć dostęp do hostowanych treści z przeglądarki internetowej na swoim komputerze, ale nie z innych urządzeń w Twojej sieci. Jeśli chcesz testować na innych urządzeniach lokalnych, skonfiguruj plik firebase.json w następujący sposób:

"emulators": {
    // ...

    "hosting": {
      "port": 5000
      "host": "0.0.0.0"
    }
  }

Generuj tokeny uwierzytelniania dla przepływów pracy ciągłej integracji

Jeśli Twoje przepływy pracy ciągłej integracji opierają się na Hostingu Firebase, będziesz musiał zalogować się przy użyciu tokena, aby uruchomić firebase emulators:exec . Pozostałe emulatory nie wymagają logowania.

Aby wygenerować token, uruchom firebase login:ci w swoim środowisku lokalnym; nie należy tego wykonywać z poziomu systemu CI. Postępuj zgodnie z instrukcjami, aby uwierzytelnić. Ten krok należy wykonać tylko raz na projekt, ponieważ token będzie ważny we wszystkich kompilacjach. Token należy traktować jak hasło; upewnij się, że jest to utrzymywane w tajemnicy.

Jeśli środowisko CI umożliwia określenie zmiennych środowiskowych, których można używać w skryptach kompilacji, po prostu utwórz zmienną środowiskową o nazwie FIREBASE_TOKEN , której wartością będzie ciąg tokenu dostępu. Interfejs Firebase CLI automatycznie pobierze zmienną środowiskową FIREBASE_TOKEN i emulatory uruchomią się poprawnie.

W ostateczności możesz po prostu umieścić token w skrypcie kompilacji, ale upewnij się, że niezaufane strony nie mają do niego dostępu. W przypadku tego zakodowanego podejścia możesz dodać --token "YOUR_TOKEN_STRING_HERE" do polecenia firebase emulators:exec .

Co następne?