इस पेज पर, JavaScript से जुड़ी समस्याओं को हल करने के लिए सुझाव और समस्या निवारण के तरीके दिए गए हैं. ये समस्याएं, Firebase JavaScript एसडीके का इस्तेमाल करते समय आ सकती हैं.
क्या आपको कोई और समस्या आ रही है या आपको अपनी समस्या नहीं दिख रही है? Firebase के सभी प्रॉडक्ट या किसी खास प्रॉडक्ट के बारे में अक्सर पूछे जाने वाले सवालों के लिए, Firebase के बारे में अक्सर पूछे जाने वाले सवाल देखें.
समस्याओं और उन्हें हल करने के तरीके की अप-टू-डेट सूची के लिए, Firebase JavaScript SDK GitHub repo पर जाएं. यहां अपनी समस्याएं भी सबमिट की जा सकती हैं.
Node.js कंस्ट्रक्ट के लिए Admin SDK, Firebase JavaScript SDK टूल के साथ काम नहीं करते
Node.js के लिए Firebase Admin SDK और Firebase JavaScript SDK, अलग-अलग तरीके से लागू किए जाते हैं. इनमें इंटरफ़ेस, क्लास या फ़ंक्शन की परिभाषाएं शेयर नहीं की जाती हैं. Admin SDK ऑब्जेक्ट के इंस्टेंस, Firebase JavaScript SDK फ़ंक्शन के साथ काम नहीं करते.
उदाहरण के लिए, Admin SDK के FirebaseApp इंस्टेंस को Firebase JavaScript SDK getDatabase फ़ंक्शन में पास करने पर, यह गड़बड़ी होती है:
TypeError: Cannot read properties of undefined (reading 'getProvider')
at _getProvider
at getDatabase
यह बात, Realtime Database के साथ-साथ पूरे Firebase JavaScript SDK टूल के एपीआई के लिए भी लागू होती है.
विपरीत दिशा में इस्तेमाल करने पर भी ऐसा ही होता है. Cloud Firestore JS SDK के Timestamp टाइप को Node.js के Firebase Admin SDK के साथ इस्तेमाल करने पर भी इसी तरह की गड़बड़ियां होती हैं.
Firebase JavaScript SDK टूल के अलग-अलग वर्शन का इस्तेमाल न करें
अगर किसी प्रोजेक्ट में, Firebase JavaScript SDK टूल के एक से ज़्यादा वर्शन को डिपेंडेंसी के तौर पर कॉन्फ़िगर किया गया है, तो एसडीके इंस्टेंस को एसडीके पैकेज के बीच पास करने पर रनटाइम से जुड़ी गड़बड़ियां होंगी. उदाहरण के लिए, FirebaseApp के गलत वर्शन के साथ Data Connect लाइब्रेरी का इस्तेमाल करने पर, यह गड़बड़ी होती है:
Error: Component data-connect has not been registered yet
आम तौर पर, यह समस्या Firebase SDK के कुछ पैकेज की डिपेंडेंसी अपडेट करने की वजह से होती है. ऐसा अक्सर तब होता है, जब अपने-आप अपडेट होने वाली डिपेंडेंसी का टूल, प्रोजेक्ट की yarn.lock या package-lock.json फ़ाइल में मौजूद Firebase SDK की डिपेंडेंसी के सबसेट को बदल देता है. कई Firebase JavaScript एसडीके एक-दूसरे के साथ काम करते हैं. इसलिए, एसडीके के अलग-अलग वर्शन इस्तेमाल करने से, रनटाइम में समस्याएं आ सकती हैं,
इस समस्या को ठीक करने के लिए, अपने प्रोजेक्ट में मौजूद node_modules/ डायरेक्ट्री और yarn.lock (yarn के लिए) या package-lock.json (npm के लिए) को मिटाएं. इसके बाद, अपनी डिपेंडेंसी फिर से इंस्टॉल करें.
अगर गड़बड़ियां बनी रहती हैं, तो npm ls
command का इस्तेमाल करके समस्या को और डीबग करें. इससे आपके प्रोजेक्ट की डिपेंडेंसी लॉग हो जाएंगी, ताकि firebase मॉड्यूल के अलग-अलग वर्शन की पहचान की जा सके.
उदाहरण के लिए, यहां दिए गए लॉग में दिखाया गया है कि package-using-older-firebase, Firebase JavaScript SDK टूल का ऐसा वर्शन इंपोर्ट कर रहा है जो किसी दूसरे SDK टूल के वर्शन से मेल नहीं खाता:
$ npm ls firebase --all
your-app@0.0.0
├── firebase@11.2.0
├─┬ @angular/fire@19.0.0
│ ├── firebase@11.2.0 deduped
│ └─┬ rxfire@6.1.0
│ └── firebase@10.14.1 deduped
└─┬ package-using-older-firebase@0.1.0
└─── firebase@10.14.1
आपके ऐप्लिकेशन में CJS और ESM के require और import स्टेटमेंट को मिक्स करने की वजह से भी गड़बड़ियां हो सकती हैं. इससे Firebase JavaScript SDK के कई इंस्टेंस बन जाते हैं. ये सभी इंस्टेंस एक-दूसरे से अलग होते हैं. इस वजह से, Firebase JavaScript SDK इंटरऑपरेबिलिटी काम नहीं करती.
इस समस्या को ठीक करने के लिए, अपने पसंदीदा बंडलर की वर्बोसिटी बढ़ाएं. उदाहरण के लिए, इसके लिए esbuild analyze flag का इस्तेमाल किया जा सकता है.
पक्का करें कि सर्विस वर्कर बंडल किए गए हों
सर्विस वर्कर को अक्सर वेब ऐप्लिकेशन के बाकी हिस्सों से अलग पाइपलाइन से बनाया जाता है. साथ ही, इन्हें Webpack जैसे बंडलर के डिफ़ॉल्ट कॉन्फ़िगरेशन में शामिल नहीं किया जाता है.
अगर अपनी सेवा के वर्कर में Firebase JavaScript SDK टूल के मॉड्यूलर वर्शन का इस्तेमाल किया जाता है, तो पक्का करें कि आपने अपने ऐप्लिकेशन बंडलर को सेवा वर्कर की सोर्स फ़ाइल शामिल करने के लिए कॉन्फ़िगर किया हो. इस उदाहरण में, npx का इस्तेमाल करके, प्रोजेक्ट की src डायरेक्ट्री में firebase-sw.js सर्विस वर्कर को बंडल किया गया है:
npx esbuild ./src/firebase-sw.js --bundle --minify --main-fields=webworker,browser,module,main,default --outfile=public/firebase-sw.js
अगर बंडल नहीं किए गए सर्विस वर्कर में ऐसे ES मॉड्यूल इंपोर्ट किए जाते हैं जो सर्विस वर्कर के साथ काम नहीं करते या ऐसी फ़ाइलें इंपोर्ट की जाती हैं जो सर्विस वर्कर के स्कोप में मौजूद नहीं हैं, तो सर्विस वर्कर चालू नहीं होगा. कभी-कभी ये गड़बड़ियां बिना किसी सूचना के होती हैं और इन्हें ठीक करना मुश्किल होता है.
अपने ऐप्लिकेशन में Firebase JavaScript SDK टूल के मॉड्यूलर वर्शन को बंडल करने के बारे में ज़्यादा जानने के लिए, Firebase के साथ मॉड्यूल बंडलर का इस्तेमाल करना लेख पढ़ें.
इसके अलावा, सीडीएन से compat
Firebase JavaScript एसडीके बंडल इंपोर्ट करके, बंडलिंग की ज़रूरत को खत्म किया जा सकता है:
// Give the service worker access to Firebase Messaging.
// Replace 10.13.2 with the version of the Firebase JS SDK you're using
// in your app.
importScripts('https://www.gstatic.com/firebasejs/10.13.2/firebase-app-compat.js');
importScripts('https://www.gstatic.com/firebasejs/10.13.2/firebase-messaging-compat.js');
// Initialize the Firebase app in the service worker by passing in
// your app's Firebase config object.
// https://firebase.google.com/docs/web/setup#config-object
firebase.initializeApp({
...
});
// Retrieve an instance of Firebase Messaging so that it can handle
// background messages.
const messaging = firebase.messaging();
सर्वर साइड रेंडरिंग का इस्तेमाल करते समय, FirebaseServerApp का इस्तेमाल करें
Firebase JavaScript एसडीके को मूल रूप से ब्राउज़र एनवायरमेंट में चलाने के लिए बनाया गया था. सर्वर साइड रेंडरिंग (एसएसआर) फ़्रेमवर्क के आने से, एसडीके का इस्तेमाल नए रनटाइम एनवायरमेंट में किया जा सकता है. ये रनटाइम, टूल और एपीआई का एक सबसेट उपलब्ध कराते हैं. ये टूल और एपीआई, वेब ब्राउज़र उपलब्ध कराते हैं.
उदाहरण के लिए, कुछ Firebase SDK टूल के लिए IndexedDB के साथ डेटा कैश मेमोरी की ज़रूरत होती है. यह सिर्फ़ ब्राउज़र पर काम करने वाला एपीआई है. Firebase Auth को साइन-इन के कुछ फ़्लो में उपयोगकर्ता के इंटरैक्शन की ज़रूरत पड़ सकती है. हेडलेस सर्वर एनवायरमेंट में ऐसा नहीं किया जा सकता. App Check टोकन बनाने से पहले, App Check उपयोगकर्ता की पुष्टि करने के लिए ब्राउज़र के अनुमानित आंकड़ों पर निर्भर करता है.
इन नए एनवायरमेंट में SDK टूल का इस्तेमाल करते समय, FirebaseServerApp का इस्तेमाल करें. यह FirebaseApp का नया वैरिएंट है. इससे, क्लाइंट-साइड से इकट्ठा किए गए डेटा के साथ, SSR Firebase इंस्टेंस को प्रीलोड किया जा सकता है.
FirebaseServerApp दो पैरामीटर के साथ काम करता है:
- Auth ID टोकन: अगर यह टोकन दिया जाता है, तो Firebase Auth पहले से पुष्टि किए गए उपयोगकर्ता को अपने-आप साइन इन कर देता है. इससे सीएसआर/एसएसआर के बीच सेशन को बढ़ाया जा सकता है.
- App Check टोकन: अगर यह टोकन दिया जाता है, तो इसका इस्तेमाल अन्य Firebase SDK टूल करते हैं. इसके लिए, उन्हें App Check क्लाइंट के इंस्टेंस को शुरू करने की ज़रूरत नहीं होती. हालांकि, यह सुविधा ब्राउज़र के बाहर काम नहीं करती. इससे उन प्रॉडक्ट के लिए एसएसआर की सुविधा चालू हो जाती है जिनमें App Check की सुविधा चालू है. जैसे, Cloud Functions, Data Connect, Cloud Firestore, Realtime Database, और Vertex AI.
Next.js में FirebaseServerApp के इस्तेमाल का उदाहरण देखने के लिए, FirebaseServerApp की मदद से, SSR ऐप्लिकेशन डेवलपमेंट को बेहतर बनाएं लेख पढ़ें.