ส่วนขยาย Firestore Bundle Builder (firestore-bundle-builder) จะทําให้ฟังก์ชัน HTTP ใช้งานได้
ซึ่งจะแสดงชุดข้อมูล Cloud Firestore คุณกำหนดแพ็กเกจในเอกสาร Firestore และส่วนขยายจะแสดงแพ็กเกจข้อมูลไฟล์ไบนารีแบบคงที่ผ่านคำขอ HTTP พร้อมกับกลไกการแคชในตัวต่างๆ โดยใช้ CDN ของ Firebase Hosting หรือ Cloud Storage เมื่อไม่มี Bundle หรือ Bundle ที่มีอยู่หมดอายุแล้ว ฟังก์ชันนี้จะสร้างและแคช Bundle ใหม่ตามต้องการ
หากต้องการใช้ส่วนขยายนี้ คุณต้องสร้างข้อกำหนดของชุดอย่างน้อย 1 รายการใน Firestore โดยใช้แดชบอร์ดผู้ดูแลระบบของส่วนขยายก่อน ข้อกำหนดของชุดข้อมูลคือวิธีที่คุณกำหนดการค้นหาที่มีชื่อ (การค้นหาคอลเล็กชันและเส้นทางเอกสารที่เฉพาะเจาะจงเพื่อเพิ่มลงในชุดข้อมูล)
นอกจากนี้ คุณยังกำหนดพารามิเตอร์ที่ต้องการใช้ในการค้นหาที่มีชื่อได้ภายในข้อกำหนดของกลุ่ม คุณตั้งค่าพารามิเตอร์เหล่านี้ได้โดยใช้พารามิเตอร์การค้นหาของ URL เมื่อเรียกใช้ฟังก์ชัน HTTP
ลิงก์ด้านบนมีวิธีการบางอย่างเพื่อให้คุณเรียกใช้ยูทิลิตีของผู้ดูแลระบบในเครื่องได้ เมื่อตั้งค่าเว็บแอปแล้ว ให้ไปที่ localhost:3000 เพื่อสร้างข้อกำหนดโดยใช้ UI ดังนี้
การสร้างและการแสดงผล Bundle
เมื่อติดตั้งส่วนขยายและสร้างข้อกำหนดของกลุ่มแล้ว คุณจะเริ่มสร้างและแสดงกลุ่มได้โดยการเรียกใช้ปลายทาง HTTP ที่ส่วนขยายระบุไว้
ระบบอาจแสดงผล Bundle ที่ขอจากแคชของไคลเอ็นต์ แคชของ Firebase Hosting หรือไฟล์ Cloud Storage ทั้งนี้ขึ้นอยู่กับข้อกำหนดของ Bundle เมื่อแคชทั้งหมดหมดอายุแล้ว คำขอแสดงผลใหม่จะทริกเกอร์การค้นหา 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 Hosting ในกรณีนี้ คุณจะต้องเรียกใช้ฟังก์ชัน HTTP ที่ติดตั้งใช้งานโดยตรงเพื่อสร้างชุด
การผสานรวมไคลเอ็นต์
จากนั้นคุณจะใช้ Bundle ด้วย 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 แต่ละรายการ (ดูด้านล่าง)