Firestore बंडल बिल्डर एक्सटेंशन का इस्तेमाल करना

Firestore बंडल बिल्डर (firestore-bundle-builder) एक्सटेंशन, एचटीटीपी फ़ंक्शन को डिप्लॉय करता है. यह फ़ंक्शन, Cloud Firestore डेटा बंडल दिखाता है. Firestore दस्तावेज़ों में बंडल तय किए जाते हैं. इसके बाद, एक्सटेंशन एचटीटीपी अनुरोधों के ज़रिए स्टैटिक बाइनरी फ़ाइल डेटा बंडल दिखाता है. साथ ही, Firebase होस्टिंग सीडीएन या Cloud Storage का इस्तेमाल करके, कैश मेमोरी में डेटा सेव करने के कई तरीके भी इस्तेमाल करता है. जब कोई बंडल मौजूद नहीं होता या मौजूदा बंडल की समयसीमा खत्म हो जाती है, तो यह फ़ंक्शन मांग पर नया बंडल बनाकर कैश मेमोरी में सेव करेगा.

इस एक्सटेंशन का इस्तेमाल करने के लिए, आपको पहले Firestore में एक या उससे ज़्यादा बंडल स्पेसिफ़िकेशन बनाने होंगे. इसके लिए, एक्सटेंशन के एडमिन डैशबोर्ड का इस्तेमाल करें. बंडल स्पेसिफ़िकेशन में, नाम वाली क्वेरी (कलेक्शन क्वेरी और बंडल में जोड़ने के लिए खास दस्तावेज़ पाथ) तय की जाती हैं.

बंडल स्पेसिफ़िकेशन में, नाम वाली क्वेरी में इस्तेमाल किए जाने वाले पैरामीटर भी तय किए जा सकते हैं. एचटीटीपी फ़ंक्शन को कॉल करते समय, यूआरएल क्वेरी पैरामीटर का इस्तेमाल करके इन पैरामीटर की वैल्यू सेट की जाती है.

ऊपर दिए गए लिंक में कुछ निर्देश दिए गए हैं, ताकि एडमिन टूल को स्थानीय तौर पर चलाया जा सके. वेब ऐप्लिकेशन सेट अप करने के बाद, यूज़र इंटरफ़ेस (यूआई) का इस्तेमाल करके स्पेसिफ़िकेशन बनाने के लिए, localhost:3000 पर जाएं:

उदाहरण

बंडल बनाना और उसे दिखाना

एक्सटेंशन इंस्टॉल करने और बंडल स्पेसिफ़िकेशन बनाने के बाद, एक्सटेंशन से दिए गए एचटीटीपी एंडपॉइंट को कॉल करके, बंडल बनाने और उन्हें दिखाने की प्रोसेस शुरू की जा सकती है.

बंडल की खास जानकारी के आधार पर, अनुरोध किया गया बंडल, क्लाइंट के कैश मेमोरी, Firebase होस्टिंग कैश मेमोरी या Cloud Storage फ़ाइल से वापस किया जा सकता है. सभी कैश मेमोरी की समयसीमा खत्म होने पर, डेटा दिखाने का नया अनुरोध, Firestore क्वेरी को ट्रिगर करेगा, ताकि मांग के हिसाब से बंडल बनाया जा सके.

Firebase होस्टिंग की साइट सेट अप करके, Firebase होस्टिंग सीडीएन की सुविधाओं का फ़ायदा लिया जा सकता है. यह साइट, रीराइट नियम का इस्तेमाल करके, सर्व फ़ंक्शन पर ले जाती है. सीडीएन आपके बंडल को कई अलग-अलग सर्वर पर कॉपी करते हैं, ताकि आपके उपयोगकर्ता अपने आस-पास मौजूद सर्वर से बंडल को अपने-आप लोड कर सकें. यह सबसे सही तरीका है.

Firebase होस्टिंग में इसे सेट अप करने के लिए, नीचे दिए गए कॉन्टेंट के साथ firebase.json फ़ाइल बनाएं या उसमें बदलाव करें. इसके बाद, साइट को डिप्लॉय करें:

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

डिप्लॉय होने के बाद, अपनी साइट के यूआरएल का इस्तेमाल करके, सीडीएन से बंडल ऐक्सेस किए जा सकते हैं. उदाहरण के लिए: https://your-site-url.com/bundles/:bundleId.

इसके अलावा, अगर आपको Firebase Hosting का इस्तेमाल नहीं करना है, तो एक्सटेंशन को Cloud Storage में डेटा कैश मेमोरी में सेव करने के लिए कॉन्फ़िगर किया जा सकता है. इस मामले में, बंडल जनरेट करने के लिए, डिप्लॉय किए गए एचटीटीपी फ़ंक्शन को सीधे कॉल किया जाएगा.

क्लाइंट इंटिग्रेशन

इसके बाद, 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);

क्वेरी आईडी को हर queries प्रॉपर्टी की परिभाषा की कुंजी के तौर पर तय किया जाता है (यहां देखें).