Utilizzo dell'estensione Firestore Bundle Builder

L'estensione Firestore Bundle Builder (firestore-bundle-builder) esegue il deployment di una funzione HTTP che pubblica i bundle di dati di Cloud Firestore. Definisci i bundle nei documenti Firestore e l'estensione pubblica il bundle di file binari statici tramite richieste HTTP, insieme a vari meccanismi di memorizzazione nella cache integrati utilizzando la CDN di Firebase Hosting o Cloud Storage. Se non esiste alcun bundle o se i bundle esistenti sono scaduti, questa funzione creerà e memorizzerà nella cache un nuovo bundle on demand.

Per utilizzare questa estensione, devi prima creare una o più specifiche di bundle in Firestore utilizzando la dashboard di amministrazione dell'estensione. La specifica del bundle è il modo in cui definisci le query denominate (query di raccolta e percorsi di documenti specifici da aggiungere al bundle).

All'interno della specifica del bundle, puoi anche definire i parametri da utilizzare nelle query denominate. Imposta i valori di questi parametri utilizzando i parametri di query URL quando chiami la funzione HTTP.

Il link riportato sopra fornisce alcune istruzioni per eseguire le utilità di amministrazione in locale. Una volta configurata l'app web, vai a localhost:3000 per creare una specifica utilizzando l'interfaccia utente:

Creazione e pubblicazione del bundle

Dopo aver installato l'estensione e creato una specifica del bundle, puoi iniziare a creare e pubblicare i bundle chiamando l'endpoint HTTP fornito dall'estensione.

A seconda della specifica del bundle, il bundle richiesto potrebbe essere restituito dalla cache del client, dalla cache di Firebase Hosting o da un file di Cloud Storage. Quando tutte le cache sono scadute, una nuova richiesta di pubblicazione attiverà le query Firestore per creare il bundle on demand.

Puoi sfruttare le funzionalità della CDN di Firebase Hosting configurando un sito di Firebase Hosting che rimanda alla funzione di pubblicazione utilizzando una regola di riscrittura. Le CDN replicano il bundle su molti server diversi, in modo che gli utenti possano caricare automaticamente il bundle dal server più vicino. Questo è l'approccio preferito.

Per configurare questa opzione in Firebase Hosting, crea o modifica un file firebase.json con i seguenti contenuti ed esegui il deployment del sito:

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

Una volta eseguito il deployment, puoi accedere ai bundle dalla CDN utilizzando l'URL del sito. Ad esempio: https://your-site-url.com/bundles/:bundleId.

In alternativa, puoi configurare l'estensione per memorizzare i dati nella cache in Cloud Storage se non vuoi utilizzare Firebase Hosting. In questo caso, chiameresti direttamente la funzione HTTP di cui è stato eseguito il deployment per generare i bundle.

Integrazione client

Poi puoi utilizzare un bundle con l'API loadBundle degli SDK Cloud Firestore. Innanzitutto, il bundle deve essere scaricato e poi fornito all'SDK. Ad esempio:

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

Una volta caricati, puoi utilizzare i dati del bundle:

Se hai specificato un array di percorsi di documenti quando hai definito il bundle, puoi ottenere i dati dei documenti sul client tramite il bundle:

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

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

Se hai specificato le query, puoi utilizzare l'API namedQuery per eseguire una query dal bundle:

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

Gli ID query sono definiti come chiave di ogni definizione della proprietà queries (vedi sotto).