Firestore Bundle Builder-Erweiterung verwenden

Die Erweiterung „Firestore Bundle Builder“ (firestore-bundle-builder) stellt eine HTTP-Funktion bereit, die Cloud Firestore-Datenpakete bereitstellt. Sie definieren die Bundles in Firestore-Dokumenten und die Erweiterung stellt statische Binärdateien über HTTP-Anfragen sowie verschiedene integrierte Caching-Mechanismen mit Firebase Hosting CDN oder Cloud Storage bereit. Wenn kein Paket vorhanden ist oder vorhandene Pakete abgelaufen sind, wird mit dieser Funktion nach Bedarf ein neues Paket erstellt und im Cache gespeichert.

Wenn Sie diese Erweiterung verwenden möchten, müssen Sie zuerst über das Dashboard der Erweiterung eine oder mehrere Paketspezifikationen in Firestore erstellen. In der Bundle-Spezifikation definieren Sie benannte Abfragen (Sammlungsabfragen und bestimmte Dokumentpfade, die dem Bundle hinzugefügt werden sollen).

In der Bundle-Spezifikation können Sie auch Parameter definieren, die in benannten Abfragen verwendet werden sollen. Sie legen Werte für diese Parameter über URL-Suchparameter fest, wenn Sie die HTTP-Funktion aufrufen.

Über den obigen Link finden Sie eine Anleitung, wie Sie die Verwaltungstools lokal ausführen können. Nachdem Sie die Webanwendung eingerichtet haben, rufen Sie localhost:3000 auf, um über die Benutzeroberfläche eine Spezifikation zu erstellen:

Bundle erstellen und bereitstellen

Nachdem du die Erweiterung installiert und eine Bundle-Spezifikation erstellt hast, kannst du Bundles erstellen und bereitstellen, indem du den von der Erweiterung bereitgestellten HTTP-Endpunkt aufrufst.

Je nach Bundle-Spezifikation wird das angeforderte Bundle möglicherweise aus dem Cache des Clients, dem Firebase Hosting-Cache oder einer Cloud Storage-Datei zurückgegeben. Wenn alle Caches abgelaufen sind, löst eine neue Bereitstellungsanfrage Firestore-Abfragen aus, um das Bundle bei Bedarf zu erstellen.

Sie können die Funktionen von Firebase Hosting CDN nutzen, indem Sie mithilfe einer Umschreibungsregel eine Firebase Hosting-Website einrichten, die auf die Bereitstellungsfunktion verweist. CDNs replizieren Ihr Bundle auf vielen verschiedenen Servern, damit Ihre Nutzer das Bundle automatisch vom nächstgelegenen Server laden können. Dies ist der bevorzugte Ansatz.

Erstellen oder bearbeiten Sie eine firebase.json-Datei mit folgendem Inhalt und stellen Sie die Website bereit, um dies in Firebase Hosting einzurichten:

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

Nach der Bereitstellung können Sie über die Website-URL auf Ihre Bundles im CDN zugreifen. Beispiel: https://your-site-url.com/bundles/:bundleId.

Alternativ können Sie die Erweiterung so konfigurieren, dass Daten in Cloud Storage im Cache gespeichert werden, wenn Sie Firebase Hosting nicht verwenden möchten. In diesem Fall rufen Sie die bereitgestellte HTTP-Funktion direkt auf, um Bundles zu generieren.

Clientintegration

Als Nächstes können Sie ein Bundle mit der loadBundle API der Cloud Firestore SDKs verwenden. Das Bundle muss zuerst heruntergeladen und dann dem SDK zur Verfügung gestellt werden. Beispiel:

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

Nach dem Laden können Sie die Daten aus dem Bundle verwenden:

Wenn Sie beim Definieren des Bundles ein Array von Dokumentpfaden angegeben haben, können Sie die Dokumentdaten auf Ihrem Client über das Bundle abrufen:

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

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

Wenn Sie Abfragen angegeben haben, können Sie mit der namedQuery API eine Abfrage aus dem Bundle ausführen:

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

Abfrage-IDs werden als Schlüssel jeder queries-Property-Definition definiert (siehe unten).