Twórz prototypy i testuj aplikacje internetowe za pomocą emulatora Hostingu Firebase

Zanim rozpoczniesz prototypowanie i testowanie aplikacji internetowej za pomocą emulatora Hostingu Firebase, poznaj ogólny przepływ pracy Pakietu emulatorów lokalnych Firebase, zainstaluj i skonfiguruj Pakiet emulatorów lokalnych oraz sprawdź jego polecenia interfejsu wiersza poleceń.

Musisz też znać funkcje i proces wdrażania Hostingu Firebase. Zacznij od wprowadzenia Hostingu Firebase.

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

Emulator Hostingu Firebase zapewnia wysoką jakość lokalnej emulacji usług hostingowych i zapewnia większość funkcji dostępnych w Hostingu produkcyjnym. Emulator Hostingu pozwala:

  • Utwórz prototypy statycznych witryn i aplikacji internetowych bez opłat za miejsce na dane i dostęp
  • Twórz prototypy, testuj i debuguj funkcje HTTPS przed wdrożeniem w witrynie Hostingu
  • Testuj witryny i aplikacje internetowe w skonteneryzowanych przepływach pracy w trybie ciągłej integracji.

Wybierz projekt Firebase

Pakiet emulatorów lokalnych Firebase emuluje usługi dla pojedynczego projektu Firebase.

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

Pakiet emulatorów lokalnych obsługuje emulację prawdziwych projektów Firebase i projektów demonstracyjnych.

Typ projektu Funkcje Używaj z emulatorami
Prawdziwa

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

Projekty rzeczywiste mają aktywne zasoby, takie jak instancje bazy danych, zasobniki na dane, funkcje lub dowolne inne zasoby skonfigurowane dla danego projektu Firebase.

Pracując z prawdziwymi projektami Firebase, możesz uruchomić emulatory dla wybranych lub wszystkich obsługiwanych usług.

W przypadku usług, których nie emulujesz, aplikacje i kod będą wchodzić w interakcje z zasobem live (instancja bazy danych, zasobnik na dane, funkcja itp.).

Demonstracyjny

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

Identyfikatory projektów demonstracyjnych mają prefiks demo-.

Podczas pracy z demonstracyjnymi projektami Firebase Twoje aplikacje i kod współdziałają tylko z emulatorami. Jeśli aplikacja spróbuje wejść w interakcję z zasobem, którego emulator nie jest uruchomiony, kod zakończy się niepowodzeniem.

W miarę możliwości zalecamy używanie projektów demonstracyjnych. W ten sposób możesz zapewnić im dostęp do tych korzyści:

  • Łatwiejsza konfiguracja – emulatory można uruchamiać bez konieczności tworzenia projektu Firebase
  • Większe bezpieczeństwo: jeśli Twój kod przypadkowo wywoła nieemulowane zasoby (produkcyjne), nie będzie możliwości zmiany danych, wykorzystania ani płatności
  • Lepsza obsługa offline, ponieważ nie trzeba mieć dostępu do internetu, aby pobrać konfigurację pakietu SDK.

Podstawowy proces tworzenia prototypu

Jeśli wykonujesz szybkie iteracje lub chcesz, aby aplikacja korzystała z emulowanych zasobów projektu backendu, możesz przetestować zawartość Hostingu i skonfigurować ją lokalnie. Podczas testowania lokalnego Firebase udostępnia aplikację internetową pod lokalnie hostowanym adresem URL.

  1. (Opcjonalnie) Domyślnie Twoja aplikacja hostowana lokalnie będzie wchodzić w interakcje z rzeczywistymi, a nie emulowanymi zasobami projektu (funkcjami, bazą danych, regułami itp.). Możesz też opcjonalnie połączyć aplikację, aby używać wszystkich skonfigurowanych przez Ciebie emulowanych zasobów projektu. Więcej informacji: Baza danych czasu rzeczywistego | Cloud Firestore | Cloud Functions

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

    firebase emulators:start

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

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

Przeprowadź test 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 w przeglądarce na komputerze, ale nie na innych urządzeniach w Twojej sieci. Jeśli chcesz przeprowadzić test na innych urządzeniach 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 ciągłej integracji

Jeśli Twoje przepływy pracy w trybie ciągłej integracji opierają się na Hostingu Firebase, do uruchomienia firebase emulators:exec będzie konieczne zalogowanie się za pomocą tokena. Pozostałe emulatory nie wymagają logowania.

Aby wygenerować token, uruchom firebase login:ci w środowisku lokalnym. Nie należy tego robić z systemu CI. Postępuj zgodnie z instrukcjami, aby się uwierzytelnić. Ten krok należy wykonać tylko raz w danym projekcie, ponieważ token będzie prawidłowy w każdej kompilacji. Token należy traktować jak hasło i pilnować, aby był utajniony.

Jeśli środowisko CI umożliwia określenie zmiennych środowiskowych, których można używać w skryptach kompilacji, utwórz po prostu zmienną środowiskową o nazwie FIREBASE_TOKEN, gdzie wartością będzie ciąg tokena dostępu. Interfejs wiersza poleceń Firebase automatycznie pobierze zmienną środowiskową FIREBASE_TOKEN, a emulatory będą się uruchamiać prawidłowo.

W ostateczności możesz dodać token do skryptu kompilacji, ale upewnij się, że niezaufane osoby nie mają do niego dostępu. W przypadku tego zakodowanego na stałe metody możesz dodać do polecenia firebase emulators:exec --token "YOUR_TOKEN_STRING_HERE".

Co dalej?