अपने Flutter प्रोजेक्ट में Firebase का इस्तेमाल शुरू करना

ज़रूरी शर्तें

• अपनी पसंद का एडिटर या आईडीई इंस्टॉल करें.

• अपने ऑपरेटिंग सिस्टम के लिए Flutter इंस्टॉल करें. इनमें ये ऑपरेटिंग सिस्टम शामिल हैं:

  • Flutter SDK
  • इस्तेमाल की जा सकने वाली लाइब्रेरी
  • प्लैटफ़ॉर्म के हिसाब से सॉफ़्टवेयर और एसडीके

प्लैटफ़ॉर्म के हिसाब से ज़रूरी शर्तें:

Apple

• अपना ऐप्लिकेशन चलाने के लिए, कोई Apple डिवाइस सेट अप करें या सिम्युलेटर का इस्तेमाल करें.

• पक्का करें कि आपका Flutter ऐप्लिकेशन, इन प्लैटफ़ॉर्म वर्शन या इसके बाद के वर्शन को टारगेट करता हो:

  • iOS 15
  • macOS 11

क्या आपको Cloud Messaging का इस्तेमाल करना है?

Apple प्लैटफ़ॉर्म पर Cloud Messaging के लिए, ये ज़रूरी शर्तें हैं:

• फ़िज़िकल Apple डिवाइस सेट अप करें.
• अपने Apple Developer खाते के लिए, Apple Push Notification Authentication Key पाएं.
• Xcode में पुश नोटिफ़िकेशन चालू करने के लिए, App > Capabilities पर जाएं.

ध्यान दें: अगर macOS या macOS Catalyst को टारगेट किया जा रहा है, तो आपको अपने टारगेट में Keychain Sharing की सुविधा जोड़नी होगी. Xcode में, अपने टारगेट के Signing & Capabilities टैब पर जाएं. इसके बाद, नई सुविधा जोड़ने के लिए, + Capabilities पर क्लिक करें.

Android

• अपना ऐप्लिकेशन चलाने के लिए, कोई डिवाइस या एम्युलेटर सेट अप करें. एम्युलेटर के लिए, Google Play वाली एम्युलेटर इमेज का इस्तेमाल करना ज़रूरी है.

• पक्का करें कि आपका ऐप्लिकेशन इन ज़रूरी शर्तों को पूरा करता हो:

  • एपीआई लेवल 24 (Nougat) या इसके बाद के वर्शन को टारगेट करता हो
  • Android 7.0 या इसके बाद के वर्शन का इस्तेमाल करता हो

वेब

प्लैटफ़ॉर्म के हिसाब से कोई ज़रूरी शर्त नहीं है

अगर आपके पास पहले से कोई Flutter ऐप्लिकेशन नहीं है, तो शुरू करें: टेस्ट ड्राइव को पूरा करके, अपने पसंदीदा एडिटर या IDE का इस्तेमाल करके नया Flutter ऐप्लिकेशन बनाया जा सकता है.

पहला चरण: ज़रूरी कमांड लाइन टूल इंस्टॉल करना

1. अगर आपने पहले से ऐसा नहीं किया है, तो Firebase सीएलआई इंस्टॉल करें.

2. अपने Google खाते का इस्तेमाल करके, Firebase में लॉग इन करें. इसके लिए, यह कमांड चलाएं:

   firebase login
   

3. किसी भी डायरेक्टरी से यह कमांड चलाकर, FlutterFire सीएलआई इंस्टॉल करें:

   dart pub global activate flutterfire_cli
   

दूसरा चरण: Firebase का इस्तेमाल करने के लिए, अपने ऐप्लिकेशन कॉन्फ़िगर करना

अपने Flutter ऐप्लिकेशन को Firebase से कनेक्ट करने के लिए, FlutterFire CLI का इस्तेमाल करें.

ऐप्लिकेशन कॉन्फ़िगरेशन वर्कफ़्लो शुरू करने के लिए, अपनी Flutter प्रोजेक्ट डायरेक्ट्री से यह कमांड चलाएं:

flutterfire configure

यह flutterfire configure वर्कफ़्लो क्या करता है?

flutterfire configure वर्कफ़्लो ये काम करता है:

• यह आपसे Flutter ऐप्लिकेशन में काम करने वाले प्लैटफ़ॉर्म (iOS, Android, वेब) चुनने के लिए कहता है. चुने गए हर प्लैटफ़ॉर्म के लिए, FlutterFire CLI आपके Firebase प्रोजेक्ट में एक नया Firebase ऐप्लिकेशन बनाता है.

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

  ध्यान दें: Firebase प्रोजेक्ट को सेट अप और मैनेज करने के बारे में कुछ सलाह यहां दी गई हैं:

  • Firebase प्रोजेक्ट में ऐप्लिकेशन जोड़ने के लिए, हमारे सबसे सही तरीके देखें. इनमें कई वैरिएंट को मैनेज करने का तरीका भी शामिल है.
  • अपने प्रोजेक्ट में Google Analytics को चालू करें. इससे आपको Crashlytics और Remote Config जैसे कई Firebase प्रॉडक्ट इस्तेमाल करने का बेहतर अनुभव मिलता है.

• यह Firebase कॉन्फ़िगरेशन फ़ाइल (firebase_options.dart) बनाती है और उसे आपकी lib/ डायरेक्ट्री में जोड़ती है.

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

• (Android पर Crashlytics या Performance Monitoring के लिए) यह आपके Flutter ऐप्लिकेशन में, प्रॉडक्ट के हिसाब से ज़रूरी Gradle प्लगिन जोड़ता है.

  ध्यान दें: FlutterFire सीएलआई, सही Gradle प्लग इन जोड़ सके, इसके लिए ज़रूरी है कि प्रॉडक्ट का Flutter प्लग इन आपके Flutter ऐप्लिकेशन में पहले से इंपोर्ट किया गया हो.

flutterfire configure को पहली बार चलाने के बाद, आपको यह कमांड फिर से चलाना होगा. ऐसा तब करना होगा, जब:

• अपने Flutter ऐप्लिकेशन में किसी नए प्लैटफ़ॉर्म के लिए सहायता उपलब्ध कराना.
• अपने Flutter ऐप्लिकेशन में Firebase की किसी नई सेवा या प्रॉडक्ट का इस्तेमाल शुरू करना. खास तौर पर, अगर आपने Google से साइन इन करने की सुविधा, Crashlytics, Performance Monitoring या Realtime Database का इस्तेमाल शुरू किया है.

कमांड को फिर से चलाने से यह पक्का होता है कि आपके Flutter ऐप्लिकेशन का Firebase कॉन्फ़िगरेशन अप-टू-डेट है. साथ ही, Android के लिए, आपके ऐप्लिकेशन में ज़रूरी Gradle प्लगिन अपने-आप जुड़ जाते हैं.

तीसरा चरण: अपने ऐप्लिकेशन में Firebase को शुरू करना

1. कोर प्लगिन इंस्टॉल करने के लिए, अपनी Flutter प्रोजेक्ट डायरेक्ट्री से यह कमांड चलाएं:

   flutter pub add firebase_core
   

2. अपने Flutter प्रोजेक्ट की डायरेक्ट्री से, यह कमांड चलाएं. इससे यह पक्का किया जा सकेगा कि आपके Flutter ऐप्लिकेशन का Firebase कॉन्फ़िगरेशन अप-टू-डेट है:

   flutterfire configure
   

3. अपनी lib/main.dart फ़ाइल में, Firebase कोर प्लगिन और पहले जनरेट की गई कॉन्फ़िगरेशन फ़ाइल को इंपोर्ट करें:

   import 'package:firebase_core/firebase_core.dart';
   import 'firebase_options.dart';
   

4. साथ ही, अपनी lib/main.dart फ़ाइल में, कॉन्फ़िगरेशन फ़ाइल से एक्सपोर्ट किए गए DefaultFirebaseOptions ऑब्जेक्ट का इस्तेमाल करके, Firebase को शुरू करें:

   WidgetsFlutterBinding.ensureInitialized();
   await Firebase.initializeApp(
     options: DefaultFirebaseOptions.currentPlatform,
   );
   runApp(const MyApp());
   

5. अपने Flutter ऐप्लिकेशन को फिर से बनाएं:

   flutter run
   

अगर आपको डेमो प्रोजेक्ट का इस्तेमाल करना है, तो Firebase एमुलेटर शुरू करें. इसके बाद, अपनी lib/main.dart फ़ाइल में demoProjectId का इस्तेमाल करके Firebase को शुरू करें. यह demo- से शुरू होना चाहिए:

await Firebase.initializeApp(
  demoProjectId: "demo-project-id",
);

चौथा चरण: Firebase प्लग इन जोड़ना

अपने Flutter ऐप्लिकेशन में Firebase को ऐक्सेस करने के लिए, अलग-अलग Firebase Flutter प्लग इन का इस्तेमाल किया जाता है. हर Firebase प्रॉडक्ट के लिए एक प्लग इन होता है. उदाहरण के लिए: Cloud Firestore, Authentication, Analytics वगैरह.

Flutter एक मल्टी-प्लैटफ़ॉर्म फ़्रेमवर्क है. इसलिए, हर Firebase प्लग इन को Apple, Android, और वेब प्लैटफ़ॉर्म पर इस्तेमाल किया जा सकता है. इसलिए, अगर Flutter ऐप्लिकेशन में कोई Firebase प्लगिन जोड़ा जाता है, तो उसका इस्तेमाल आपके ऐप्लिकेशन के Apple, Android, और वेब वर्शन में किया जाएगा.

Firebase Flutter प्लग इन जोड़ने का तरीका यहां बताया गया है:

1. अपनी Flutter प्रोजेक्ट डायरेक्ट्री से, यह कमांड चलाएं:

   flutter pub add PLUGIN_NAME

2. अपनी Flutter प्रोजेक्ट डायरेक्ट्री से, यह कमांड चलाएं:

   flutterfire configure
   

   इस कमांड को चलाने से यह पक्का होता है कि आपके Flutter ऐप्लिकेशन का Firebase कॉन्फ़िगरेशन अप-टू-डेट है. साथ ही, Android पर Crashlytics और Performance Monitoring के लिए, आपके ऐप्लिकेशन में ज़रूरी Gradle प्लग इन जोड़े जाते हैं.

3. इसके बाद, अपने Flutter प्रोजेक्ट को फिर से बनाएं:

   flutter run
   

अब आप बिलकुल तैयार हैं! आपके Flutter ऐप्लिकेशन, Firebase का इस्तेमाल करने के लिए रजिस्टर और कॉन्फ़िगर हो गए हैं.

वेब ऐप्लिकेशन बनाने के लिए ध्यान देने वाली खास बातें

वेब प्लैटफ़ॉर्म को टारगेट करते समय, कॉन्फ़िगरेशन के इन विकल्पों को देखें.

ट्रस्टेड टाइप के लिए सहायता

Flutter के लिए Firebase SDK टूल, भरोसेमंद टाइप के इस्तेमाल की सुविधा देता है. इससे डीओएम-आधारित (क्लाइंट-साइड) XSS हमलों को रोकने में मदद मिलती है. जब आपके ऐप्लिकेशन के लिए ट्रस्टेड टाइप को लागू करने की सुविधा चालू की जाती है, तब Firebase SDK, ट्रस्टेड टाइप की कस्टम नीतियों का इस्तेमाल करके, डीओएम में अपनी स्क्रिप्ट इंजेक्ट करता है. इन नीतियों के नाम flutterfire-firebase_core, flutterfire-firebase_auth वगैरह होते हैं.

Firebase JavaScript SDK टूल के ऑटो-इंजेक्शन की सुविधा बंद करना

डिफ़ॉल्ट रूप से, Firebase Flutter SDK, वेब के लिए ऐप्लिकेशन बनाते समय Firebase JavaScript SDK को अपने-आप इंजेक्ट करता है. अगर आपको Firebase JavaScript SDK टूल को अपने-आप इंजेक्ट होने से रोकना है, तो यह तरीका अपनाएं:

1. अपने Flutter प्रोजेक्ट में web/index.html फ़ाइल में मौजूद <script> टैग में यह प्रॉपर्टी जोड़कर, अपने-आप इंजेक्ट होने वाली स्क्रिप्ट को अनदेखा करें:

   <!-- Add this property inside a <script> tag within your "web/index.html" file in your Flutter project -->
   <!-- Put in the names of all the plugins you wish to ignore: -->
   window.flutterfire_ignore_scripts = ['analytics', 'firestore'];
   

2. इनमें से किसी एक विकल्प का इस्तेमाल करके, स्क्रिप्ट को मैन्युअल तरीके से लोड करें:

   • पहला विकल्प: window.addEventListener कॉलबैक के अंदर, अपनी web/index.html फ़ाइल में एसडीके को साफ़ तौर पर जोड़ें:

       window.addEventListener('load', async function (ev) {
         window.firebase_firestore = await import("https://www.gstatic.com/firebasejs/13.1.0/firebase-firestore.js");
         window.firebase_analytics = await import("https://www.gstatic.com/firebasejs/13.1.0/firebase-analytics.js");
     
         _flutter.loader.loadEntrypoint().then(function (engineInitializer) {
           // rest of the code
     

   • दूसरा विकल्प: gstatic डोमेन से प्लगिन का Firebase JavaScript SDK कोड डाउनलोड करें. इसके बाद, उसे JavaScript फ़ाइल में सेव करें, ताकि उसे आपके प्रोजेक्ट में रखा जा सके और मैन्युअल तरीके से लोड किया जा सके:

       // "web/my-analytics.js" & "web/my-firestore.js" file loaded as a script into your "web/index.html" file:
       window.addEventListener('load', async function (ev) {
         window.firebase_analytics = await import("./my-analytics.js");
         window.firebase_firestore = await import("./my-firestore.js");
     
         _flutter.loader.loadEntrypoint().then(function (engineInitializer) {
           // rest of the code
     

---

उपलब्ध प्लगिन

प्रॉडक्ट	प्लग इन का नाम	iOS	Android	वेब	Apple के अन्य डिवाइस (macOS वगैरह)	खिड़कियां
Firebase AI Logic ^1	firebase_ai				बीटा
Analytics	firebase_analytics				बीटा
App Check	firebase_app_check				बीटा
Authentication	firebase_auth				बीटा	बीटा
Cloud Firestore	cloud_firestore				बीटा	बीटा
Cloud Functions	cloud_functions				बीटा
Cloud Messaging	firebase_messaging				बीटा
Cloud Storage	firebase_storage				बीटा	बीटा
Crashlytics	firebase_crashlytics				बीटा
In-App Messaging	firebase_in_app_messaging
Firebase इंस्टॉल	firebase_app_installations				बीटा
Performance Monitoring	firebase_performance
Realtime Database	firebase_database				बीटा
Remote Config	firebase_remote_config				बीटा
SQL Connect ^2	firebase_data_connect
इस्तेमाल से बाहर हो चुकी या काम न करने वाली लाइब्रेरी
Dynamic Links	firebase_dynamic_links
एमएल मॉडल डाउनलोडर	firebase_ml_model_downloader				बीटा

^{1 Firebase AI Logic को पहले "Vertex AI in Firebase" कहा जाता था. इसमें प्लग इन firebase_vertexai का इस्तेमाल किया जाता था.}

^{2 Firebase SQL Connect को पहले "Firebase Data Connect" कहा जाता था.}

चेतावनी: Windows पर Firebase का इस्तेमाल, प्रोडक्शन के लिए नहीं किया जाता. इसका इस्तेमाल सिर्फ़ लोकल डेवलपमेंट वर्कफ़्लो के लिए किया जाता है.

---

अगले चरण

• Firebase Flutter कोडलैब की मदद से, Firebase को Flutter के साथ इस्तेमाल करने का अनुभव पाएं.

• अपना ऐप्लिकेशन लॉन्च करने के लिए तैयार हो जाएं:

  • Google Cloud कंसोल में अपने प्रोजेक्ट के लिए, बजट से जुड़ी सूचनाएं सेट अप करें.
  • Firebase कंसोल में इस्तेमाल और बिलिंग डैशबोर्ड पर नज़र रखें. इससे आपको Firebase की कई सेवाओं में, अपने प्रोजेक्ट के इस्तेमाल की पूरी जानकारी मिलेगी.
  • Firebase लॉन्च चेकलिस्ट देखें.