支持 Firebase JavaScript SDK 的环境

受支持的环境

以下环境正式支持 Firebase JavaScript SDK。

浏览器

Firebase 产品 Edge Firefox Chrome iOS 版 Safari Safari
Firebase AI Logic 1
Analytics
App Check
Authentication
Cloud Firestore
（永久性存储
除外）
（如果 iOS 版本低于 10，
则永久性存储
除外）
Cloud Functions
Firebase 安装
Cloud Messaging
（Edge 17 及更高版本，移动版除外）
Cloud Storage
Data Connect
Performance Monitoring
Realtime Database
Remote Config

1 Firebase AI Logic 以前称为“Vertex AI in Firebase”。

其他环境

Firebase 产品 React Native Node.js (18+) Chrome
扩展程序		 Cordova
Firebase AI Logic 1
App Check
（使用自定义提供程序进行原生设备认证）
（使用自定义提供程序）
Analytics
Authentication
（请参阅备注）
（请参阅备注）
（请参阅备注）
（请参阅备注）
Cloud Firestore
（永久性存储
除外）
（永久性存储
除外）
Cloud Functions
Data Connect
Firebase 安装
Cloud Messaging
Cloud Storage
（上传
除外）
Performance Monitoring
Realtime Database
Remote Config

1 Firebase AI Logic 以前称为“Vertex AI in Firebase”。

Polyfill

Firebase JavaScript SDK 基于 Web 平台的最新标准构建。某些较旧的浏览器和 JavaScript 环境未必能支持 Firebase 所需的所有功能。如果您必须支持这些浏览器/环境，则需要相应地加载 Polyfill。

以下部分指明了您可能需要的大部分 Polyfill。

必需的 Polyfill

环境 Polyfill
Safari 7、8、9 ES Stable
Node < 10 ES Stable

可选的 Polyfill

环境 Polyfill Firebase 产品
  • Safari（低于 10.1 的版本）
  • iOS（低于 10.3 的版本）
 提取
  • Authentication
  • Cloud Firestore
  • Cloud Functions
  • Performance Monitoring
  • Node < 18
 提取
  • Authentication
  • Cloud Firestore
  • Cloud Functions
  • Cloud Storage
  • React Native 和 Expo
 base-64
  • Cloud Storage

建议的 Polyfill

Polyfill 许可
ES Stable MIT
提取 -“cross-fetch”- 最适合旧版浏览器 MIT
提取 -“undici” - 最适合 Node.js MIT
base-64 MIT

React Native 和 Expo 所需的 Polyfill 设置

对于 React Native 和 Expo，如果您要上传 base-64 编码的字符串，则需要执行以下操作：

从 npm 安装 base-64：

npm install base-64

从 base-64 导入 decode，并以 atob 的形式将其附加到全局范围，以便 Cloud Storage 可以访问它。

import { decode } from 'base-64';

if(typeof atob === 'undefined') {
  global.atob = decode;
}

在您的应用中添加 Polyfill

方式 1：（推荐）使用与 Babel 集成的捆绑器

如果您使用捆绑器，请将其与 Babel 和 @babel/preset-env 集成以获取 Polyfill。

请使用 Babel 的交互式设置指南了解如何将 Babel 与您的捆绑器集成。

使用 Babel，您无需担心到底要包含哪些 Polyfill。您只需指定自己需要支持的最低要求的浏览器环境，然后 Babel 就会为您添加所需的 Polyfill。即使 Firebase 或您自己的代码开始使用新的 ES 功能，Babel 也能确保始终满足您对浏览器支持的要求。

@babel/preset-env 包含用于指定环境目标（选项 targets）和添加 Polyfill（选项 useBuiltIns）的可用配置选项的详细信息。

方式 2：（不推荐）手动添加 Polyfill

您可以使用喜欢的 Polyfill 库（例如 core-js）手动添加 Polyfill。

import 'core-js/stable'
import 'cross-fetch/polyfill';

core-js 还提供了一个多合一 Polyfill 文件，您可以直接将其包含在 HTML 页面中。

如果您不使用 Babel，使用此文件可以便捷地管理 Polyfill。但是，我们不建议将此多合一文件用于生产应用，因为它可能包含不需要的 Polyfill，这会增加页面重量，因而增加页面加载时间。