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

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

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

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

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

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

Apple

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

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

  • iOS 15
  • macOS 10.15

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

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

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

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

Android

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

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

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

वेब

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

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

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

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

2. नीचे दिए गए निर्देश को चलाकर, अपने Google खाते से Firebase में लॉग इन करें:

   firebase login
   

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

   dart pub global activate flutterfire_cli
   

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

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

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

flutterfire configure

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

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

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

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

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

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

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

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

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

  ध्यान दें: FlutterFire CLI को सही 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 Emulator शुरू करें. इसके बाद, अपनी 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 का इस्तेमाल करने के लिए रजिस्टर और कॉन्फ़िगर किए गए हों.

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

Trusted Types की सुविधा

Flutter के लिए Firebase SDK टूल, भरोसेमंद टाइप का इस्तेमाल करने की सुविधा देता है. इससे DOM-आधारित (क्लाइंट-साइड) XSS हमलों को रोकने में मदद मिलती है. जब अपने ऐप्लिकेशन के लिए भरोसेमंद टाइप लागू करने की सुविधा चालू की जाती है, तब Firebase SDK, कस्टम भरोसेमंद टाइप की नीतियों का इस्तेमाल करके, अपनी स्क्रिप्ट को DOM में इंजेक्ट करता है. इन नीतियों के नाम 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. इनमें से किसी एक विकल्प का इस्तेमाल करके, स्क्रिप्ट को मैन्युअल तरीके से लोड करें:

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

       window.addEventListener('load', async function (ev) {
         window.firebase_firestore = await import("https://www.gstatic.com/firebasejs/12.13.0/firebase-firestore.js");
         window.firebase_analytics = await import("https://www.gstatic.com/firebasejs/12.13.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				बीटा
SQL Connect ^2	firebase_data_connect
Dynamic Links	firebase_dynamic_links
In-App Messaging	firebase_in_app_messaging
Firebase इंस्टॉल किए गए ऐप्लिकेशन	firebase_app_installations				बीटा
एमएल मॉडल डाउनलोडर	firebase_ml_model_downloader				बीटा
Performance Monitoring	firebase_performance
Realtime Database	firebase_database				बीटा
Remote Config	firebase_remote_config				बीटा

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

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

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

---

अगले चरण

• Firebase Flutter Codelab को इस्तेमाल करके देखें.

• ऐप्लिकेशन लॉन्च करने की तैयारी करना:

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