Prototypowanie i testowanie aplikacji internetowych za pomocą Emulatora Hostingu Firebase

Zanim zaczniesz tworzyć prototyp i testować swoją aplikację internetową za pomocą Firebase Hosting, upewnij się, że znasz ogólny przepływ pracy związany z usługą Firebase Local Emulator Suite, oraz musisz zainstalować i skonfigurować Local Emulator Suite i zapoznaj się z poleceniami interfejsu wiersza poleceń.

Znasz też funkcje i proces wdrażania dla Firebase Hosting. Zacznij od Przedstawiamy Firebase Hosting.

Co mogę zrobić za pomocą emulatora Firebase Hosting?

Emulator Firebase Hosting zapewnia wysokiej jakości lokalną emulator Hosting, udostępniając większość funkcji dostępnych w produkcyjne Hosting. Emulator usługi Hosting umożliwia:

  • Twórz prototypy witryn statycznych i aplikacji internetowych bez zwiększania ilości miejsca na dane i dostępu obciążenia
  • Twórz prototypy, testuj i debuguj funkcje HTTPS przed wdrożeniem w Hostingu strona internetowa
  • Testuj witryny i aplikacje internetowe w skonteneryzowanych przepływach pracy w trybie ciągłej integracji.

Wybierz projekt Firebase

Funkcja Firebase Local Emulator Suite emuluje produkty z jednego projektu Firebase.

Aby wybrać projekt do użycia, przed uruchomieniem emulatorów uruchom interfejs wiersza poleceń firebase use w katalogu roboczym. Możesz też przejść flagę --project poszczególnych emulatorów .

Local Emulator Suite obsługuje emulację prawdziwych projektów Firebase oraz projektów demograficznych.

Typ projektu Funkcje Używanie z emulatorami
Prawdziwe

Prawdziwy projekt Firebase to projekt utworzony i skonfigurowany przez Ciebie (najprawdopodobniej za pomocą konsoli Firebase).

Prawdziwe projekty mają aktywne zasoby, takie jak instancje baz danych, miejsce na dane zasobników, funkcji lub innych zasobów utworzonych dla danej usługi Firebase w projektach AI.

Podczas pracy z prawdziwymi projektami Firebase możesz używać emulatorów dla lub wszystkich obsługiwanych usług.

W przypadku usług, których nie emulujesz, aplikacje i kod będą interakcja z zasobem aktywnym (instancją bazy danych, pamięcią masową) zasobnik, funkcja itp.).

Wersja demonstracyjna

Projekt demonstracyjny Firebase nie ma rzeczywistej konfiguracji Firebase oraz brak aktywnych zasobów. Dostęp do tych projektów uzyskuje się zazwyczaj w ramach ćwiczeń z programowania lub innych samouczków.

Identyfikatory projektów demonstracyjnych mają prefiks demo-.

Podczas pracy z projektami demonstracyjnymi Firebase Twoje aplikacje i kod współdziałają tylko emulatory. Jeśli aplikacja próbuje wchodzić w interakcję z zasobem w przypadku których emulator nie jest uruchomiony, kod ten zakończy się niepowodzeniem.

Zalecamy, aby w miarę możliwości korzystać z projektów demonstracyjnych. W ten sposób możesz zapewnić im dostęp do tych korzyści:

  • Łatwiejsza konfiguracja, ponieważ emulatory można uruchamiać bez konieczności tworzenia Projekt Firebase
  • Silniejsze bezpieczeństwo, ponieważ jeśli Twój kod przypadkowo wywoła nieemulowany (produkcyjnych), nie jest prawdopodobne, że nastąpi zmiana danych, jego użycia i rozliczeń
  • lepsza obsługa offline, ponieważ nie trzeba łączyć się z internetem, pobierz konfigurację pakietu SDK.
.

Proces tworzenia prototypowania

Jeśli wykonujesz szybkie iteracje lub chcesz, aby aplikacja działała emulowane zasoby projektu backendu, możesz przetestować treść w Hosting go lokalnie. Podczas testów lokalnych Firebase udostępnia aplikację internetową hostowany adres URL.

  1. (Opcjonalnie) Domyślnie aplikacja hostowana lokalnie będzie wchodzić w interakcję z prawdziwymi, nie emulowane zasobów projektu (funkcji, bazy danych, reguł itp.); Zamiast tego możesz opcjonalnie połączyć aplikację z dowolnym emulowanym projektem skonfigurowanych przez Ciebie zasobach. Więcej informacji: Realtime Database | Cloud Firestore | Cloud Functions

  2. W katalogu głównym projektu lokalnego uruchom to polecenie:

    firebase emulators:start
  3. Otwórz aplikację internetową pod lokalnym adresem URL zwróconym przez interfejs wiersza poleceń (zwykle http://localhost:5000).

  4. Aby wprowadzić zmiany do lokalnego adresu URL, odśwież przeglądarkę.

Testowanie z innych urządzeń lokalnych

Domyślnie emulatory odpowiadają tylko na żądania wysyłane przez localhost. Ten Oznacza to, że dostęp do hostowanych treści będzie możliwy przez internet na komputerze. z przeglądarki, ale nie z innych urządzeń w sieci. Jeśli chcesz prowadzić testy innych urządzeń lokalnych, skonfiguruj firebase.json w ten sposób:

"emulators": {
    // ...

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

Generowanie tokenów uwierzytelniania na potrzeby przepływów pracy w trybie ciągłej integracji

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

Aby wygenerować token, uruchom firebase login:ci w środowisku lokalnym. w tym nie powinny być wykonywane w systemie CI. Wykonaj instrukcje uwierzytelniania. Ten krok musisz wykonać tylko raz w każdym projekcie, ponieważ token będzie i wszystkie kompilacje. Token powinien być traktowany jak hasło. upewnić się, i jest chroniona.

Jeśli środowisko CI umożliwia określenie zmiennych środowiskowych, których można użyć używanych w skryptach kompilacji, wystarczy utworzyć zmienną środowiskową o nazwie FIREBASE_TOKEN, gdzie wartością jest ciąg tokena dostępu. Interfejs wiersza poleceń Firebase automatycznie pobierze środowisko FIREBASE_TOKEN , a emulatory uruchomią się prawidłowo.

W ostateczności możesz po prostu umieścić token w skrypcie kompilacji, aby zapewnić, że niezaufane osoby nie będą miały do niego dostępu. W przypadku tego kodu możesz dodać --token "YOUR_TOKEN_STRING_HERE" do firebase emulators:exec.

Co dalej?