Firestore 번들 빌더 확장 프로그램 사용

Firestore 번들 빌더(firestore-bundle-builder) 확장 프로그램은 Cloud Firestore 데이터 번들을 제공하는 HTTP 함수를 배포합니다. Firestore 문서에서 번들을 정의하면 확장 프로그램이 Firebase 호스팅 CDN 또는 Cloud Storage를 사용하는 기본 제공되는 다양한 캐싱 메커니즘과 함께 HTTP 요청을 통해 정적 바이너리 파일 데이터 번들을 제공합니다. 번들이 없거나 기존 번들이 만료된 경우 이 함수는 새 번들을 주문형으로 빌드하고 캐시합니다.

이 확장 프로그램을 사용하려면 먼저 확장 프로그램의 관리자 대시보드를 사용하여 Firestore에 하나 이상의 번들 사양을 만들어야 합니다. 번들 사양은 이름이 지정된 쿼리(번들에 추가할 컬렉션 쿼리 및 특정 문서 경로)를 정의하는 방법입니다.

번들 사양 내에서 이름이 지정된 쿼리에 사용할 매개변수를 정의할 수도 있습니다. HTTP 함수를 호출할 때 URL 쿼리 매개변수를 사용하여 이러한 매개변수의 값을 설정합니다.

위의 링크는 관리자 유틸리티를 로컬에서 실행할 수 있도록 몇 가지 지침을 제공합니다. 웹 앱을 설정한 후 localhost:3000으로 이동하여 UI를 사용하여 사양을 만듭니다.

예시

번들 빌드 및 제공

확장 프로그램을 설치하고 번들 사양을 만든 후에는 확장 프로그램에서 제공하는 HTTP 엔드포인트를 호출하여 번들 빌드 및 제공을 시작할 수 있습니다.

번들 사양에 따라 요청된 번들이 클라이언트의 캐시, Firebase 호스팅 캐시 또는 Cloud Storage 파일에서 반환될 수 있습니다. 모든 캐시가 만료되면 새 제공 요청이 Firestore 쿼리를 트리거하여 주문형으로 번들을 빌드합니다.

재작성 규칙을 사용하여 제공 함수를 가리키는 Firebase 호스팅 사이트를 설정하여 Firebase 호스팅 CDN의 기능을 활용할 수 있습니다. CDN은 여러 서버에 번들을 복제하므로 사용자가 가장 가까운 서버에서 번들을 자동으로 로드할 수 있습니다. 이 방법을 사용하는 것이 좋습니다.

Firebase 호스팅에서 이를 설정하려면 다음 콘텐츠로 firebase.json 파일을 만들거나 수정하고 사이트를 배포합니다.

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

배포 후 사이트 URL을 사용하여 CDN에서 번들에 액세스할 수 있습니다. 예를 들면 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 속성 정의의 키로 정의됩니다(아래 참조).