Firebase JavaScriptSDKでサポートされている環境

サポートされる環境

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

ブラウザ

その他の環境

ポリフィル

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

以下のセクションでは、必要なポリフィルのほとんどを特定しています。

必要なポリフィル

オプションのポリフィル

推奨されるポリフィル

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

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

オプション 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 を使用しない場合にポリフィルを管理するのに便利な方法です。ただし、本番アプリではこのオールインワン オプションはお勧めしません。不要なポリフィルが含まれる可能性が高く、ページの重量が増加し、ページの読み込み時間が長くなるからです。