Utilizzo dell'estensione Firestore Bundle Builder

L'estensione Firestore Bundle Builder ( firestore-bundle-builder ) distribuisce una funzione HTTP che serve i bundle di dati Cloud Firestore . Definisci i pacchetti nei documenti Firestore e l'estensione fornisce pacchetti di dati di file binari statici tramite richieste HTTP, insieme a vari meccanismi di memorizzazione nella cache integrati utilizzando Firebase Hosting CDN o Cloud Storage. Quando non esiste alcun pacchetto o i pacchetti esistenti sono scaduti, questa funzione creerà e memorizzerà nella cache un nuovo pacchetto su richiesta.

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

All'interno delle specifiche del bundle è inoltre possibile definire parametri da utilizzare nelle query denominate. Puoi impostare i valori per questi parametri utilizzando i parametri di query dell'URL quando chiami la funzione HTTP.

Il collegamento precedente fornisce alcune istruzioni per poter eseguire le utilità di amministrazione localmente. Una volta configurata l'app Web, vai a localhost:3000 per creare una specifica utilizzando l'interfaccia utente:

esempio

Costruire e servire il Bundle

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

A seconda delle specifiche del pacchetto, il pacchetto richiesto potrebbe essere restituito dalla cache del client, dalla cache di Firebase Hosting o da un file Cloud Storage. Quando tutte le cache saranno scadute, una nuova richiesta di servizio attiverà le query Firestore per creare il pacchetto su richiesta.

Puoi sfruttare le funzionalità del CDN Firebase Hosting configurando un sito di hosting Firebase che punta alla funzione di servizio utilizzando una regola di riscrittura. I CDN replicano il tuo pacchetto su molti server diversi, in modo che i tuoi utenti possano caricare automaticamente il pacchetto dal server più vicino. Questo è l'approccio preferito.

Per configurarlo in Firebase Hosting, crea o modifica un file firebase.json con i seguenti contenuti e distribuisci il sito :

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

Una volta distribuito, puoi accedere ai tuoi pacchetti dalla CDN utilizzando l'URL del tuo sito. Ad esempio: https://your-site-url.com/bundles/:bundleId .

In alternativa, puoi configurare l'estensione per memorizzare nella cache i dati in Cloud Storage se non desideri utilizzare Firebase Hosting. In questo caso, chiameresti direttamente la funzione HTTP distribuita per generare bundle.

Integrazione del cliente

Successivamente puoi utilizzare un bundle con l'API loadBundle degli SDK Cloud Firestore. Innanzitutto è necessario scaricare il pacchetto e quindi fornirlo all'SDK. Per 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 caricato, puoi utilizzare i dati del pacchetto:

Se hai specificato un array di percorsi di documenti quando hai definito il bundle, puoi ottenere i dati del documento sul tuo 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 delle 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 delle query sono definiti come chiave di ogni definizione di proprietà queries (vedere di seguito).