Environnements compatibles avec le SDK Firebase JavaScript

Environnements compatibles

Le SDK Firebase JavaScript est officiellement compatible avec les environnements suivants.

Navigateurs

Produit Firebase Edge Firefox Chrome Safari sur iOS Safari
Firebase AI Logic 1
Analytics
App Check
Authentication
Cloud Firestore
(except
persistence)

(sauf
persistence
si iOS < 10)
Cloud Functions
Firebase installations
Cloud Messaging
(Edge 17 ou version ultérieure, sauf sur mobile)
Cloud Storage
Data Connect
Performance Monitoring
Realtime Database
Remote Config

1 Firebase AI Logic s'appelait auparavant "Vertex AI in Firebase".

Autres environnements

Produit Firebase React Native Node.js (18+) Extensions Chrome
Cordova
Firebase AI Logic 1
App Check
(en utilisant un fournisseur personnalisé pour effectuer l'attestation de l'appareil natif)

(en utilisant un fournisseur personnalisé)
Analytics
Authentication
(voir Remarque)

(voir Remarque)

(voir Remarque)

(voir Remarque)
Cloud Firestore
(except
persistence)

(except
persistence)
Cloud Functions
Data Connect
Firebase installations
Cloud Messaging
Cloud Storage
(sauf les importations
)
Performance Monitoring
Realtime Database
Remote Config

1 Firebase AI Logic s'appelait auparavant "Vertex AI in Firebase".

Polyfills

Le SDK Firebase JavaScript est basé sur les dernières normes de la plate-forme Web. Certains navigateurs et environnements JavaScript plus anciens ne sont pas compatibles avec toutes les fonctionnalités requises par Firebase. Si vous devez prendre en charge ces navigateurs/environnements, vous devez charger les polyfills en conséquence.

Les sections ci-dessous identifient la plupart des polyfills dont vous pourriez avoir besoin.

Polyfills requis

Environnements Polyfills
Safari 7, 8 et 9 ES Stable
Nœud < 10 ES Stable

Polyfills facultatifs

Environnements Polyfills Produits 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 et Expo
base-64
  • Cloud Storage

Polyfills suggérés

Polyfills Licence
ES Stable MIT
fetch : `cross-fetch` : idéal pour les anciens navigateurs MIT
fetch : `undici` : idéal pour Node.js MIT
base-64 MIT

Configuration requise du polyfill pour React Native et Expo

Pour React Native et Expo, si vous importez une chaîne encodée en base64, vous devez procéder comme suit :

Installez base-64 depuis npm :

npm install base-64

Importez decode depuis base-64 et associez-le au champ d'application global en tant que atob afin que Cloud Storage puisse y accéder.

import { decode } from 'base-64';

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

Ajouter des polyfills dans votre application

Option 1 : (recommandée) utiliser un bundler intégré à Babel

Si vous utilisez un bundler, intégrez-le à Babel et @babel/preset-env pour obtenir des polyfills.

Utilisez le guide de configuration interactif de Babel pour découvrir comment intégrer Babel à votre bundler.

Avec Babel, vous n'avez pas à vous soucier des polyfills exacts à inclure. Au lieu de cela, vous spécifiez les environnements de navigateur minimaux que vous devez prendre en charge. Babel ajoute ensuite les polyfills nécessaires pour vous. Babel garantit que vos exigences en matière de compatibilité avec les navigateurs sont toujours respectées, même si Firebase ou votre propre code commencent à utiliser de nouvelles fonctionnalités ES.

@babel/preset-env fournit des informations détaillées sur les options de configuration disponibles pour spécifier les cibles d'environnement (option targets) et ajouter des polyfills (option useBuiltIns).

Option 2 : (non recommandé) Ajouter des polyfills manuellement

Vous pouvez ajouter des polyfills manuellement à l'aide de vos bibliothèques de polyfills préférées (par exemple, core-js).

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

core-js fournit également un fichier polyfill tout-en-un que vous pouvez inclure directement dans la page HTML.

Cette option peut être un moyen pratique de gérer les polyfills si vous n'utilisez pas Babel. Toutefois, nous ne recommandons pas cette option tout-en-un pour les applications de production, car elle inclura probablement des polyfills inutiles, ce qui augmentera le poids de la page et donc le temps de chargement de la page.