Utiliser l'extension Firestore Bundle Builder

L'extension Firestore Bundle Builder (firestore-bundle-builder) déploie une fonction HTTP qui fournit des bundles de données Cloud Firestore. Vous définissez les bundles dans les documents Firestore. L'extension diffuse le bundle de données de fichier binaire statique via des requêtes HTTP, ainsi que divers mécanismes de mise en cache intégrés à l'aide du CDN Firebase Hosting ou de Cloud Storage. Lorsqu'aucun bundle n'existe ou que les bundles existants ont expiré, cette fonction crée et met en cache un nouveau bundle à la demande.

Pour utiliser cette extension, vous devez d'abord créer une ou plusieurs spécifications de bundle dans Firestore à l'aide du tableau de bord d'administration de l'extension. La spécification du bundle vous permet de définir des requêtes nommées (requêtes de collection et chemins d'accès à des documents spécifiques à ajouter au bundle).

Dans la spécification du bundle, vous pouvez également définir des paramètres destinés à être utilisés dans des requêtes nommées. Vous définissez les valeurs de ces paramètres à l'aide de paramètres de requête d'URL lorsque vous appelez la fonction HTTP.

Le lien ci-dessus fournit des instructions pour exécuter les utilitaires d'administration en local. Une fois l'application Web configurée, accédez à localhost:3000 pour créer une spécification à l'aide de l'interface utilisateur :

Créer et diffuser le bundle

Une fois l'extension installée et une spécification de bundle créée, vous pouvez commencer à créer et à diffuser des bundles en appelant le point de terminaison HTTP fourni par l'extension.

En fonction de la spécification du bundle, le bundle demandé peut être renvoyé à partir du cache du client, du cache Firebase Hosting ou d'un fichier Cloud Storage. Lorsque tous les caches ont expiré, une nouvelle requête de diffusion déclenche des requêtes Firestore pour créer le bundle à la demande.

Vous pouvez profiter des fonctionnalités du CDN Firebase Hosting en configurant un site Firebase Hosting qui pointe vers la fonction de diffusion à l'aide d'une règle de réécriture. Les CDN répliquent votre bundle sur de nombreux serveurs différents, de sorte que vos utilisateurs peuvent charger automatiquement le bundle à partir du serveur le plus proche. Il s'agit de l'approche recommandée.

Pour configurer cela dans Firebase Hosting, créez ou modifiez un fichier firebase.json avec le contenu suivant, puis déployez le site :

{
  "hosting": {
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
    "rewrites": [
      {
        "source": "/bundles/*",
        "function": "ext-firestore-bundle-builder-serve"
      }
    ]
  }
}

Une fois déployés, vous pouvez accéder à vos bundles depuis le CDN à l'aide de l'URL de votre site. Exemple : https://your-site-url.com/bundles/:bundleId.

Vous pouvez également configurer l'extension pour mettre en cache les données dans Cloud Storage si vous ne souhaitez pas utiliser Firebase Hosting. Dans ce cas, vous devez appeler directement la fonction HTTP déployée pour générer des bundles.

Intégration du client

Vous pouvez ensuite utiliser un bundle avec l'API loadBundle des SDK Cloud Firestore. Le bundle doit d'abord être téléchargé, puis fourni au SDK. Exemple :

import { loadBundle } from "firebase/firestore";

// Download the bundle from the Firebase Hosting CDN:
const bundle = await fetch("/bundles/:bundleId");

// If not using a CDN, download the bundle directly:
// const bundle = await fetch('https://<location>-<project-id>.cloudfunctions.net/ext-firestore-bundle-builder-serve/:bundleId');

await loadBundle(bundle);

Une fois les données chargées, vous pouvez les utiliser :

Si vous avez spécifié un tableau de chemins de document lorsque vous avez défini le bundle, vous pouvez obtenir les données du document sur votre client via le bundle :

import { getFirestore, doc, getDocFromCache } from "firebase/firestore";
// Bundle Document IDs: ['users/92x1NgSWYKUC4AG4s2nHGMR2ikZ2']

const ref = doc(getFirestore(), "users/92x1NgSWYKUC4AG4s2nHGMR2ikZ2");
const snapshot = await getDocFromCache(ref);

Si vous avez spécifié des requêtes, vous pouvez utiliser l'API namedQuery pour exécuter une requête à partir du bundle :

import { getFirestore, namedQuery } from "firebase/firestore";
const query = await namedQuery(getFirestore(), "queryId");
const snapshot = await getDocsFromCache(query);

Les ID de requête sont définis comme clé de chaque définition de propriété queries (voir ci-dessous).