ส่วนขยาย Firestore Bundle Builder (firestore-bundle-builder) จะทำให้ฟังก์ชัน HTTP ที่แสดงแพ็กเกจข้อมูล Cloud Firestore ใช้งานได้ คุณเป็นผู้กำหนดแพ็กเกจในเอกสาร Firestore และส่วนขยายจะแสดงชุดข้อมูลไฟล์ไบนารีแบบคงที่ผ่านคำขอ HTTP พร้อมด้วยกลไกการแคชต่างๆ ในตัวโดยใช้ CDN โฮสติ้งของ Firebase หรือ Cloud Storage เมื่อไม่มีแพ็กเกจหรือแพ็กเกจที่มีอยู่หมดอายุ ฟังก์ชันนี้จะสร้างและแคชแพ็กเกจใหม่ตามคำขอ
หากต้องการใช้ส่วนขยายนี้ คุณต้องสร้างข้อกำหนดของแพ็กเกจอย่างน้อย 1 รายการใน Firestore โดยใช้หน้าแดชบอร์ดผู้ดูแลระบบของส่วนขยาย ข้อกำหนดของกลุ่มคือวิธีที่คุณกำหนดคำค้นหาที่มีชื่อ (คำค้นหาคอลเล็กชันและเส้นทางเอกสารเฉพาะที่จะเพิ่มในกลุ่ม)
ในข้อมูลจำเพาะของ Bundle คุณยังกำหนดพารามิเตอร์ที่ควรใช้ในการค้นหาที่มีชื่อได้ด้วย คุณตั้งค่าให้พารามิเตอร์เหล่านี้ได้โดยใช้พารามิเตอร์การค้นหาของ URL เมื่อคุณเรียกใช้ฟังก์ชัน HTTP
ลิงก์ด้านบนจะแสดงวิธีการเพื่อให้คุณเรียกใช้ยูทิลิตีของผู้ดูแลระบบภายในเครื่องได้ เมื่อตั้งค่าเว็บแอปแล้ว ให้ไปที่ localhost:3000 เพื่อสร้างข้อกำหนดโดยใช้ UI ดังนี้
การสร้างและให้บริการแพ็กเกจ
เมื่อติดตั้งส่วนขยายและสร้างข้อกำหนดของ Bundle แล้ว คุณจะเริ่มสร้างและแสดง Bundle ได้โดยเรียกใช้ปลายทาง HTTP ที่ส่วนขยายให้ไว้
กลุ่มที่ขออาจส่งคืนจากแคชของไคลเอ็นต์ แคชโฮสติ้งของ Firebase หรือไฟล์ Cloud Storage ทั้งนี้ขึ้นอยู่กับข้อกำหนดของแพ็กเกจ เมื่อแคชทั้งหมดหมดอายุ คำขอการแสดงผลใหม่จะทริกเกอร์การค้นหาของ Firestore เพื่อสร้างแพ็กเกจตามคำขอ
คุณสามารถใช้ประโยชน์จากความสามารถของ CDN โฮสติ้งของ Firebase ได้โดยการตั้งค่าเว็บไซต์โฮสติ้งของ Firebase ที่ชี้ไปยังฟังก์ชันการแสดงผลโดยใช้กฎการเขียนใหม่ CDN จะจำลองแพ็กเกจของคุณไปยังเซิร์ฟเวอร์ต่างๆ มากมาย เพื่อให้ผู้ใช้โหลดแพ็กเกจจากเซิร์ฟเวอร์ที่ใกล้ที่สุดได้โดยอัตโนมัติ ซึ่งนี่คือวิธีการที่แนะนำ
หากต้องการตั้งค่านี้ในโฮสติ้งของ Firebase ให้สร้างหรือแก้ไขไฟล์ firebase.json ที่มีเนื้อหาต่อไปนี้และทำให้เว็บไซต์ใช้งานได้
{
"hosting": {
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"rewrites": [
{
"source": "/bundles/*",
"function": "ext-firestore-bundle-builder-serve"
}
]
}
}
เมื่อติดตั้งใช้งานแล้ว คุณจะเข้าถึงแพ็กเกจจาก CDN ได้โดยใช้ URL ของเว็บไซต์ เช่น https://your-site-url.com/bundles/:bundleId
หรือคุณจะกำหนดค่าส่วนขยายให้แคชข้อมูลใน Cloud Storage ก็ได้หากไม่ต้องการใช้โฮสติ้งของ Firebase ในกรณีนี้ คุณจะเรียกใช้ฟังก์ชัน HTTP ที่ทำให้ใช้งานได้โดยตรงเพื่อสร้าง���พ็กเกจ
การผสานรวมไคลเอ็นต์
ขั้นตอนต่อไปคุณจะใช้แพ็กเกจที่มี loadBundle API ของ Cloud Firestore SDK ได้ โดยจะต้องดาวน์โหลด Bundle ก่อน แล้วส่งไปยัง 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);
หากระบุการค้นหาไว้ คุณจะใช้ API ของ namedQuery เพื่อเรียกใช้การค้นหาจากแพ็กเกจได้
import { getFirestore, namedQuery } from "firebase/firestore";
const query = await namedQuery(getFirestore(), "queryId");
const snapshot = await getDocsFromCache(query);
รหัสคำค้นหาหมายถึงคีย์ของคำจำกัดความของพร็อพเพอร์ตี้ queries แต่ละรายการ (ดูด้านล่าง)