Firebase JavaScript SDK でサポートされる環境

サポートされる環境

Firebase JavaScript SDK は次の環境で正式にサポートされています。

ブラウザ

Firebase プロダクト Edge Firefox Chrome iOS Safari Safari
App Check
Analytics
Authentication
Cloud Firestore
（永続性
は除く）
（iOS 10 未満の場合、
永続性
は除く）
Cloud Functions
Firebaseインストール
Cloud Messaging
（Edge 17 以降、モバイルを除く）
Cloud Storage
Performance Monitoring
Realtime Database
Remote Config
Vertex AI in Firebase

その他の環境

Firebase プロダクト React Native Node.js（18 以降） Chrome
拡張機能		 Cordova
App Check
（ネイティブ デバイスの認証にカスタム プロバイダを使用）
（カスタム プロバイダを使用）
Analytics
Authentication
（注を参照）
（注を参照）
（注を参照）
（注を参照）
Cloud Firestore
（永続性
は除く）
（永続性
は除く）
Cloud Functions
Firebaseインストール
Cloud Messaging
Cloud Storage
（アップロード
は除く）
Performance Monitoring
Realtime Database
Remote Config
Vertex AI in Firebase

ポリフィル

Firebase JavaScript SDK は、最新のウェブ プラットフォーム標準に基づいて構築されています。古いブラウザや JavaScript 環境の中には、Firebase に必要なすべての機能をサポートしていないものがあります。そのようなブラウザや環境をサポートする必要がある場合は、適宜ポリフィルを読み込む必要があります。

必要になる可能性があるポリフィルを以下のセクションに示します。

必須のポリフィル

環境 ポリフィル
Safari 7、8、9 ES Stable
Node 10 未満 ES Stable

任意のポリフィル

環境 ポリフィル Firebase プロダクト
  • Safari 10.1 未満
  • iOS 10.3 未満
 fetch
  • Authentication
  • Cloud Firestore
  • Cloud Functions
  • Performance Monitoring
  • Node 18 未満
 fetch
  • Authentication
  • Cloud Firestore
  • Cloud Functions
  • Cloud Storage
  • React Native と Expo
 base-64
  • Cloud Storage

推奨されるポリフィル

ポリフィル ライセンス
ES Stable MIT
fetch -「cross-fetch」- 古いブラウザに最適 MIT
fetch -「undici」- Node.js に最適 MIT
base-64 MIT

React Native と Expo に必須のポリフィルの設定

React Native と Expo では、Base64 でエンコードされた文字列をアップロードする場合、次のことを行う必要があります。

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;
}

アプリケーションにポリフィルを追加する

オプション 1: （推奨）Babel と統合されたバンドラを使用する

バンドラを使用している場合は、Babel や @babel/preset-env と統合してポリフィルを取得します。

Babel をバンドラと統合する方法については、Babel のインタラクティブな設定ガイドをご覧ください。

Babel を使うと、含める必要のあるポリフィルについて細かく気にする必要がなくなります。サポートする必要がある最小限のブラウザ環境を指定するだけで済みます。あとは Babel が必要なポリフィルを追加してくれます。Firebase や独自のコードが新しい ES の機能を使い始めても、Babel によってブラウザ サポートの要件が常に満たされることが保証されます。

@babel/preset-env には構成オプションに関する詳しい情報が記載されています。環境ターゲットの指定（オプション targets）や、ポリフィルの追加（オプション useBuiltIns）などのオプションがあります。

オプション 2: （非推奨）ポリフィルを手動で追加する

お気に入りのポリフィル ライブラリ（core-js など）を使用して、ポリフィルを手動で追加できます。

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

core-js には、HTML ページに直接含めることができるオールインワンのポリフィル ファイルも用意されています。

Babel を使用しない場合、このオプションはポリフィルを管理するのに便利な方法です。ただし、このオールインワン オプションを本番環境用アプリに使用することはおすすめしません。これには不要なポリフィルが含まれる可能性が高く、ページが重くなって読み込み時間が長くなるためです。