Na tej stronie znajdziesz wskazówki i rozwiązania problemów z JavaScriptem, które mogą wystąpić podczas korzystania z pakietu SDK Firebase JavaScript.
Masz inne problemy lub nie widzisz swojego? Więcej informacji na temat Firebase i poszczególnych usług znajdziesz w głównych najczęstszych pytaniach dotyczących Firebase.
Możesz też sprawdzić Firebase JavaScriptrepozytorium GitHub pakietu SDK, aby uzyskać aktualną listę zgłoszonych problemów i rozwiązań, a także zgłaszać własne problemy.
Konstrukcje Admin SDK dla Node.js nie są zgodne z pakietem SDK Firebase JavaScript.
Firebase Admin SDK dla Node.js i pakiet SDK Firebase JavaScript to odrębne implementacje, które nie mają wspólnych definicji interfejsów, klas ani funkcji. Instancje obiektów Admin SDK są niezgodne z funkcjami pakietu Firebase JavaScript SDK.
Na przykład instancja Admin SDK's FirebaseApp przekazana do funkcji Firebase JavaScript pakietu SDK getDatabase powoduje następujący błąd:
TypeError: Cannot read properties of undefined (reading 'getProvider')
at _getProvider
at getDatabase
Dotyczy to całej powierzchni interfejsu API pakietu SDK Firebase JavaScript, a nie tylko Realtime Database.
Dotyczy to też używania w przeciwnym kierunku. Próba użycia typu Cloud Firestorepakietu JS SDKTimestamp z Firebase Admin SDKpakietem SDK dla Node.jsTimestamp powoduje podobne błędy.
Unikaj używania sprzecznych wersji pakietu SDK Firebase JavaScript
Wiele sprzecznych wersji pakietu SDK Firebase JavaScript skonfigurowanych jako zależności w projekcie spowoduje błędy w czasie działania, gdy instancje pakietu SDK będą przekazywane między pakietami SDK. Na przykład użycie biblioteki Data Connect z niepasującą wersją FirebaseApp powoduje wystąpienie tego błędu:
Error: Component data-connect has not been registered yet
Ten problem jest zwykle spowodowany aktualizacją zależności jednego z pakietów Firebase SDK, ale nie wszystkich. Sytuacja ta często występuje, gdy automatyczne narzędzie do aktualizacji zależności zmienia podzbiór zależności pakietu SDK Firebase w pliku yarn.lock lub package-lock.json projektu. Wiele pakietów SDK Firebase JavaScriptwspółpracuje ze sobą, dlatego używanie różnych wersji pakietów SDK powoduje niezgodności w czasie działania.
Aby rozwiązać ten problem, usuń katalog node_modules/ i yarn.lock (w przypadku yarn) lub package-lock.json (w przypadku npm) w projekcie i ponownie zainstaluj zależności.
Jeśli błędy nadal występują, rozwiąż problem za pomocą polecenia npm ls. Spowoduje to zarejestrowanie zależności projektu, dzięki czemu możesz zidentyfikować sprzeczne wersje modułu firebase.
Na przykład ten log pokazuje, że package-using-older-firebase importuje
konfliktującą wersję pakietu SDK Firebase JavaScript:
$ npm ls firebase --all
your-app@0.0.0
├── firebase@11.2.0
├─┬ @angular/fire@19.0.0
│ ├── firebase@11.2.0 deduped
│ └─┬ rxfire@6.1.0
│ └── firebase@10.14.1 deduped
└─┬ package-using-older-firebase@0.1.0
└─── firebase@10.14.1
Błędy mogą też występować z powodu mieszania w aplikacji instrukcji CJS i ESM require i import. Powoduje to tworzenie wielu instancji pakietu SDK Firebase JavaScript, z których każda jest odrębna od pozostałych, co zakłóca interoperacyjność pakietu SDK Firebase JavaScript.
Aby debugować ten scenariusz, zwiększ poziom szczegółowości wybranego narzędzia do łączenia. Możesz na przykład użyć do tego flagi esbuild analyze.
Sprawdź, czy skrypty service worker są spakowane
Skrypty service worker są często tworzone w ramach osobnego procesu niż reszta aplikacji internetowej i nie są uwzględniane w domyślnej konfiguracji narzędzi do łączenia plików, takich jak Webpack.
Jeśli w usłudze Service Worker używasz modułowej wersji pakietu SDK Firebase JavaScript, skonfiguruj narzędzie do tworzenia pakietów aplikacji tak, aby zawierało plik źródłowy usługi Service Worker. W przykładzie poniżej użyto npx do powiązaniafirebase-sw.js komponentu service worker w katalogu src projektu:
npx esbuild ./src/firebase-sw.js --bundle --minify --main-fields=webworker,browser,module,main,default --outfile=public/firebase-sw.js
Aktywacja skryptu service worker, który nie jest częścią pakietu, nie powiedzie się, jeśli importuje moduły ES, które nie obsługują skryptów service worker, lub pliki, które nie istnieją w zakresie skryptu service worker. Czasami te błędy są niewidoczne i trudne do wykrycia.
Więcej informacji o pakowaniu modułowej wersji pakietu SDK Firebase JavaScript w aplikacji znajdziesz w artykule Używanie narzędzi do pakowania modułów z Firebase.
Możesz też wyeliminować konieczność tworzenia pakietów, importując pakiety SDK compat
Firebase JavaScript z sieci CDN:
// Give the service worker access to Firebase Messaging.
// Replace 10.13.2 with the version of the Firebase JS SDK you're using
// in your app.
importScripts('https://www.gstatic.com/firebasejs/10.13.2/firebase-app-compat.js');
importScripts('https://www.gstatic.com/firebasejs/10.13.2/firebase-messaging-compat.js');
// Initialize the Firebase app in the service worker by passing in
// your app's Firebase config object.
// https://firebase.google.com/docs/web/setup#config-object
firebase.initializeApp({
...
});
// Retrieve an instance of Firebase Messaging so that it can handle
// background messages.
const messaging = firebase.messaging();
Używaj FirebaseServerApp podczas pracy z renderowaniem po stronie serwera
Firebase JavaScript SDK został pierwotnie zaprojektowany do działania w środowiskach przeglądarki. Wprowadzenie platform renderowania po stronie serwera (SSR) powoduje, że pakiet SDK jest używany w nowych środowiskach wykonawczych. Te środowiska wykonawcze udostępniają podzbiór narzędzi i interfejsów API, które są dostępne w przeglądarkach internetowych.
Na przykład niektóre pakiety Firebase SDK wymagają buforowania danych za pomocą interfejsu IndexedDB, który jest dostępny tylko w przeglądarce. Firebase Auth może wymagać interakcji użytkownika w przypadku niektórych procesów logowania, co jest niemożliwe w środowiskach serwera bez interfejsu. App Check polega na heurystyce przeglądarki, aby zweryfikować użytkownika przed utworzeniem tokenów App Check.
Podczas pracy z pakietem SDK w tych nowych środowiskach używaj FirebaseServerApp, czyli nowego wariantu FirebaseApp, który umożliwia wstępne wczytywanie instancji Firebase SSR z danymi zebranymi po stronie klienta.
FirebaseServerApp obsługuje 2 parametry:
- Token identyfikatora uwierzytelniania: jeśli jest podany, usługa Uwierzytelnianie Firebase automatycznie loguje wcześniej uwierzytelnionego użytkownika, potencjalnie obejmując sesję w ramach podziału CSR/SSR.
- Token Sprawdzania aplikacji: jeśli jest podany, token jest używany przez inne pakiety SDK Firebase bez konieczności inicjowania instancji klienta App Check (co nie jest obsługiwane poza środowiskami przeglądarki). Umożliwia to obsługę SSR w przypadku usług, w których jest włączona funkcja App Check, takich jak Cloud Functions, Data Connect, Cloud Firestore, Realtime Database i Vertex AI.
Więcej informacji o używaniu funkcji FirebaseServerApp w Next.js znajdziesz w artykule Usprawnianie tworzenia aplikacji SSR za pomocą FirebaseServerApp.