На этой странице приведены советы и рекомендации по устранению неполадок JavaScript, с которыми вы можете столкнуться при использовании Firebase JavaScript SDK.
У вас есть другие проблемы или вы не видите свою проблему? Обязательно ознакомьтесь с основным разделом FAQ Firebase, чтобы узнать больше FAQ по Firebase или по конкретным продуктам.
Вы также можете проверить репозиторий Firebase JavaScript SDK GitHub, чтобы ознакомиться с актуальным списком зарегистрированных проблем и способами их устранения, а также сообщить о своих проблемах там.
Конструкции Admin SDK для Node.js несовместимы с Firebase JavaScript SDK
Firebase Admin SDK для Node.js и Firebase JavaScript SDK — это отдельные реализации, которые не разделяют определения интерфейсов, классов или функций. Экземпляры объектов Admin SDK несовместимы с функциями Firebase JavaScript SDK.
Например, экземпляр FirebaseApp
из Admin SDK , переданный в функцию Firebase JavaScript SDK getDatabase
вызывает следующую ошибку:
TypeError: Cannot read properties of undefined (reading 'getProvider')
at _getProvider
at getDatabase
Это справедливо для всей поверхности Firebase JavaScript SDK API, а не только Realtime Database . Это также справедливо для использования в обратном направлении. Попытка использовать тип Timestamp
Cloud Firestore JS SDK с Firebase Admin SDK для Node.js приводит к аналогичным ошибкам.
Избегайте использования конфликтующих версий Firebase JavaScript SDK
Несколько конфликтующих версий Firebase JavaScript SDK, настроенных как зависимости в проекте, приведут к ошибкам времени выполнения при передаче экземпляров SDK между пакетами SDK. Например, использование библиотеки Data Connect с несоответствующей версией FirebaseApp
приведет к следующей ошибке:
Error: Component data-connect has not been registered yet
Эта проблема обычно вызвана обновлением зависимости одного, но не всех пакетов Firebase SDK. Такая ситуация часто возникает, когда автоматизированный инструмент обновления зависимостей изменяет подмножество зависимостей Firebase SDK в файле yarn.lock
или package-lock.json
проекта. Поскольку многие Firebase JavaScript SDK взаимодействуют друг с другом, использование различных версий SDK приводит к несовместимости во время выполнения,
Чтобы исправить эту проблему, удалите каталог node_modules
/ и yarn.lock
(для yarn
) или package-lock.json
(для npm
) в вашем проекте и переустановите зависимости.
Если ошибки остаются, выполните дальнейшую отладку проблемы с помощью команды npm ls . Это позволит зарегистрировать зависимости вашего проекта, чтобы вы могли определить конфликтующие версии модуля firebase
.
Например, следующий журнал показывает, что package-using-older-firebase
импортирует конфликтующую версию Firebase JavaScript SDK:
$ 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
Ошибки также могут возникать из-за смешивания операторов require
и import
CJS и ESM в вашем приложении. Это создает несколько экземпляров Firebase JavaScript SDK, каждый из которых отличается от другого, что нарушает взаимодействие Firebase JavaScript SDK. Увеличьте уровень детализации выбранного вами сборщика для отладки этого сценария. Например, для этой цели можно использовать флаг esbuild analyze .
Убедитесь, что работники сферы услуг объединены
Service Workers часто создаются из отдельного конвейера, отличного от остальной части веб-приложения, и не включены в конфигурацию по умолчанию упаковщиков, таких как Webpack.
Если вы используете модульную версию Firebase JavaScript SDK в вашем service worker, то убедитесь, что вы настроили свой app bundler для включения исходного файла service worker. В следующем примере npx
используется для объединения firebase-sw.js
service worker в каталоге src
проекта:
npx esbuild ./src/firebase-sw.js --bundle --minify --main-fields=webworker,browser,module,main,default --outfile=public/firebase-sw.js
Активация невключенного service worker не удастся, если он импортирует модули ES, которые не поддерживают service worker, или файлы, которые не существуют в области действия service worker. Иногда эти сбои происходят незаметно и их трудно отладить.
Дополнительную информацию о включении модульной версии Firebase JavaScript SDK в ваше приложение см. в разделе Использование сборщиков модулей с Firebase .
В качестве альтернативы вы можете устранить необходимость в пакетировании, импортировав compat
пакеты Firebase JavaScript SDK из 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();
Используйте FirebaseServerApp
при работе с рендерингом на стороне сервера
Firebase JavaScript SDK изначально предназначался для работы в браузерных средах. Введение фреймворков Server-Side Rendering (SSR) продвигает использование SDK в новые среды выполнения. Эти среды выполнения предоставляют подмножество инструментов и API, которые предоставляют веб-браузеры.
Например, некоторые Firebase SDK требуют кэширования данных с IndexedDB, API только для браузера. Firebase Auth может потребовать взаимодействия с пользователем в определенных потоках входа, что невозможно в средах headless-сервера. App Check использует эвристику браузера для проверки пользователя перед созданием токенов App Check .
При работе с SDK в этих новых средах используйте FirebaseServerApp
— новый вариант FirebaseApp
, который предоставляет средства для предварительной загрузки экземпляра SSR Firebase данными, собранными со стороны клиента.
FirebaseServerApp
поддерживает два параметра:
- Токен идентификатора аутентификации : если предоставлен, Firebase Auth автоматически выполняет вход в систему ранее аутентифицированного пользователя, потенциально охватывая сеанс через разделение CSR/SSR.
- App Check Token : если предоставлен, токен используется другими Firebase SDK без необходимости инициализации экземпляра клиента App Check (который не поддерживается вне сред браузера). Это разблокирует поддержку SSR для продуктов, в которых включена App Check , таких как Cloud Functions , Data Connect , Cloud Firestore , Realtime Database и Vertex AI.
Пример использования FirebaseServerApp
в Next.js см. в разделе Оптимизация разработки приложений SSR с помощью FirebaseServerApp.