Firebase JavaScript SDK সেরা অনুশীলন

এই পৃষ্ঠায় Firebase JavaScript SDK ব্যবহার করার সময় আপনার সম্মুখীন হতে পারে এমন জাভাস্ক্রিপ্ট সমস্যার জন্য টিপস এবং সমস্যা সমাধানের প্রস্তাব দেওয়া হয়েছে।

অন্য কোন সমস্যা আছে নাকি সমস্যাটি দেখতে পাচ্ছেন না? আরও প্যান-ফায়ারবেস বা পণ্য-নির্দিষ্ট প্রায়শই জিজ্ঞাসিত প্রশ্নাবলীর জন্য Firebase-এর প্রধান প্রায়শই জিজ্ঞাসিত প্রশ্নাবলীটি দেখতে ভুলবেন না।

আপনি Firebase JavaScript SDK GitHub রেপোতে রিপোর্ট করা সমস্যা এবং সমস্যা সমাধানের একটি হালনাগাদ তালিকা দেখতে পারেন এবং সেখানে আপনার নিজস্ব সমস্যাগুলি ফাইল করতে পারেন।

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 API পৃষ্ঠের জন্য সত্য। এটি বিপরীত দিকে ব্যবহারের জন্যও সত্য। Node.js-এর জন্য Firebase Admin SDK সাথে Cloud Firestore JS SDK-এর Timestamp টাইপ ব্যবহার করার চেষ্টা করলেও একই রকম ত্রুটি দেখা দেয়।

Firebase JavaScript SDK-এর বিরোধপূর্ণ সংস্করণ ব্যবহার করা এড়িয়ে চলুন

কোনও প্রকল্পে নির্ভরতা হিসেবে কনফিগার করা Firebase JavaScript SDK-এর একাধিক পরস্পরবিরোধী সংস্করণ SDK প্যাকেজগুলির মধ্যে SDK ইনস্ট্যান্স পাস করার সময় রানটাইম ত্রুটির কারণ হতে পারে। উদাহরণস্বরূপ, FirebaseApp এর একটি অমিল সংস্করণের সাথে Data Connect লাইব্রেরি ব্যবহার করলে নিম্নলিখিত ত্রুটি দেখা দেয়:

Error: Component data-connect has not been registered yet

এই সমস্যাটি সাধারণত Firebase SDK প্যাকেজের একটির নির্ভরতা আপডেটের কারণে হয়, কিন্তু সবগুলো নয়। এই পরিস্থিতি প্রায়শই ঘটে যখন একটি স্বয়ংক্রিয় নির্ভরতা আপডেট টুল প্রকল্পের yarn.lock বা package-lock.json ফাইলের মধ্যে Firebase SDK নির্ভরতার একটি উপসেট পরিবর্তন করে। যেহেতু অনেক Firebase JavaScript SDK একে অপরের সাথে আন্তঃক্রিয়াশীল, তাই SDK-এর বিভিন্ন সংস্করণ ব্যবহারের ফলে রানটাইম অসঙ্গতি দেখা দেয়,

এই সমস্যা সমাধানের জন্য, আপনার প্রোজেক্ট থেকে node_modules / ডিরেক্টরি এবং yarn.lock ( yarn এর জন্য) অথবা package-lock.json ( npm এর জন্য) মুছে ফেলুন এবং আপনার নির্ভরতা পুনরায় ইনস্টল করুন।

যদি ত্রুটি থেকে যায়, তাহলে npm ls কমান্ড দিয়ে সমস্যাটি আরও ডিবাগ করুন। এটি আপনার প্রকল্পের নির্ভরতা লগ করবে যাতে আপনি firebase মডিউলের বিরোধপূর্ণ সংস্করণগুলি সনাক্ত করতে পারেন।

উদাহরণস্বরূপ, নিম্নলিখিত লগটি Firebase JavaScript SDK-এর একটি বিরোধপূর্ণ সংস্করণ আমদানি করার package-using-older-firebase দেখায়:

$ 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 analyse পতাকা ব্যবহার করতে পারেন।

নিশ্চিত করুন যে পরিষেবা কর্মীরা একত্রিত আছেন

পরিষেবা কর্মীরা প্রায়শই একটি ওয়েব অ্যাপের বাকি অংশ থেকে আলাদা পাইপলাইন থেকে তৈরি করা হয় এবং ওয়েবপ্যাকের মতো বান্ডলারের ডিফল্ট কনফিগারেশনে অন্তর্ভুক্ত থাকে না।

যদি আপনি আপনার সার্ভিস ওয়ার্কারের মধ্যে Firebase JavaScript SDK এর মডুলার সংস্করণ ব্যবহার করেন, তাহলে নিশ্চিত করুন যে আপনি আপনার অ্যাপ বান্ডলারটি সার্ভিস ওয়ার্কার সোর্স ফাইল অন্তর্ভুক্ত করার জন্য কনফিগার করেছেন। নিম্নলিখিত উদাহরণটি প্রকল্পের src ডিরেক্টরিতে firebase-sw.js সার্ভিস ওয়ার্কারকে বান্ডেল করার জন্য npx ব্যবহার করে:

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 এর সাথে মডিউল বান্ডলার ব্যবহার করা দেখুন।

বিকল্পভাবে, আপনি CDN থেকে compat Firebase JavaScript SDK বান্ডেলগুলি আমদানি করে বান্ডলিং করার প্রয়োজনীয়তা দূর করতে পারেন:

// 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 এসডিকে মূলত ব্রাউজার পরিবেশে চালানোর জন্য তৈরি করা হয়েছিল। সার্ভার-সাইড রেন্ডারিং (এসএসআর) ফ্রেমওয়ার্কের প্রবর্তন SDK ব্যবহারকে নতুন রানটাইম পরিবেশে ঠেলে দেয়। এই রানটাইমগুলি ওয়েব ব্রাউজারগুলি সরবরাহ করে এমন সরঞ্জাম এবং API-এর একটি উপসেট সরবরাহ করে।

উদাহরণস্বরূপ, কিছু Firebase SDK-এর জন্য IndexedDB-এর মাধ্যমে ডেটা ক্যাশিং প্রয়োজন হয়, যা একটি ব্রাউজার-শুধুমাত্র API। Firebase Auth-এর জন্য কিছু নির্দিষ্ট সাইন-ইন ফ্লোতে ব্যবহারকারীর ইন্টারঅ্যাকশনের প্রয়োজন হতে পারে যা হেডলেস সার্ভার পরিবেশে অসম্ভব। App Check App Check তৈরি করার আগে ব্যবহারকারীকে যাচাই করার জন্য ব্রাউজার হিউরিস্টিকের উপর নির্ভর করে।

এই নতুন পরিবেশে SDK এর সাথে কাজ করার সময়, FirebaseServerApp ব্যবহার করুন, এটি FirebaseApp এর একটি নতুন রূপ যা ক্লায়েন্ট পক্ষ থেকে সংগৃহীত ডেটা সহ SSR Firebase ইনস্ট্যান্স প্রিলোড করার উপায় প্রদান করে।

FirebaseServerApp দুটি প্যারামিটার সমর্থন করে:

• Auth ID টোকেন : যদি প্রদান করা হয়, Firebase Auth স্বয়ংক্রিয়ভাবে পূর্বে প্রমাণিত ব্যবহারকারীর সাথে সাইন ইন করে, সম্ভাব্যভাবে CSR / SSR বিভাজন জুড়ে একটি সেশন বিস্তৃত করে।
• অ্যাপ চেক টোকেন : যদি সরবরাহ করা হয়, তাহলে টোকেনটি অন্যান্য ফায়ারবেস SDK দ্বারা ব্যবহার করা হয়, কোনও App Check ক্লায়েন্টের (যা ব্রাউজার পরিবেশের বাইরে সমর্থিত নয়) কোনও ইনস্ট্যান্স ইনিশিয়ালাইজ করার প্রয়োজন ছাড়াই। এটি Cloud Functions , Data Connect , Cloud Firestore , Realtime Database এবং ভার্টেক্স এআই-এর মতো App Check সক্ষম করা পণ্যগুলির জন্য SSR সমর্থন আনব্লক করে।

Next.js-এ FirebaseServerApp ব্যবহারের উদাহরণের জন্য FirebaseServerApp দিয়ে Streamline SSR অ্যাপ ডেভেলপমেন্ট দেখুন।