使用 Firestore Bundle Builder 擴充

Firestore Bundle Builder ( firestore-bundle-builder ) 擴充部署一個為Cloud Firestore 封包提供服務的 HTTP 函數。您可以在 Firestore 文件中定義捆綁包，擴充功能透過 HTTP 請求提供靜態二進位檔案資料捆綁包，並使用 Firebase Hosting CDN 或 Cloud Storage 提供各種內建快取機制。當不存在捆綁包或現有捆綁包已過期時，此函數將按需建置並快取新捆綁包。

要使用此擴充程序，您需要先使用擴充功能的管理儀表板在 Firestore 中建立一個或多個捆綁包規範。捆綁規範是您定義命名查詢（集合查詢和要新增到捆綁中的特定文件路徑）的方式。

在捆綁規範中，您也可以定義用於命名查詢的參數。當您呼叫 HTTP 函數時，您可以使用 URL 查詢參數設定這些參數的值。

上面的連結提供了一些說明，以便您可以在本地運行管理實用程式。設定好 Web 應用程式後，導覽至 localhost:3000 以使用 UI 建立規格：

例子

建置與服務 Bundle

安裝擴充功能並建立捆綁包規範後，您可以透過呼叫擴充功能提供的 HTTP 端點來開始建置和提供捆綁包。

根據捆綁包規範，請求的捆綁包可能會從客戶端快取、Firebase 託管快取或雲端儲存檔案返回。當所有快取都過期時，新的服務請求將觸發 Firestore 查詢以按需建立捆綁包。

您可以透過設定一個使用重寫規則指向服務功能的 Firebase 託管網站來利用 Firebase Hosting CDN 的功能。 CDN 在許多不同的伺服器上複製您的捆綁包，以便您的用戶可以自動從最近的伺服器載入捆綁包。這是首選方法。

若要在 Firebase 託管中進行設置，請建立或編輯包含以下內容的firebase.json檔案並部署網站：

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

部署後，您可以使用網站 URL 從 CDN 存取您的捆綁包。例如：https: https://your-site-url.com/bundles/:bundleId 。

或者，如果您不想使用 Firebase 託管，則可以將擴充功能配置為在 Cloud Storage 中快取資料。在這種情況下，您可以直接呼叫已部署的 HTTP 函數來產生套件。

客戶端集成

接下來，您可以使用 Cloud Firestore SDK 的loadBundle API 使用套裝組合。首先需要下載捆綁包，然後提供給 SDK。例如：

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

載入後，您可以使用捆綁包中的資料：

如果您在定義套件時指定了文件路徑數組，則可以透過套件取得用戶端上的文件資料：

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

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

如果您指定了查詢，則可以使用namedQuery API從捆綁包中執行查詢：

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

查詢 ID 被定義為每個queries屬性定義的鍵（見下文）。