إضافة Firebase إلى تطبيقك المكتوب باستخدام Flutter


المتطلبات الأساسية

  • ثبِّت أداة التعديل أو حزمة IDE المفضّلة لديك.

  • اضبط جهاز Apple فعليًا أو استخدِم محاكيًا لتشغيل تطبيقك.

  • تأكَّد من أنّ تطبيق Flutter يستهدف إصدارات المنصة التالية أو الإصدارات الأحدث:

    • الإصدار 13 من نظام التشغيل iOS
    • الإصدار 10.15 من نظام التشغيل macOS

  • ثبِّت Flutter لنظام التشغيل المخصّص لجهازك، بما في ذلك ما يلي:

    • حزمة تطوير البرامج (SDK) من Flutter
    • المكتبات الداعمة
    • البرامج وحِزم تطوير البرامج (SDK) الخاصة بالنظام الأساسي

  • سجِّل الدخول إلى Firebase باستخدام حسابك على Google.

إذا لم يكن لديك تطبيق Flutter، يمكنك إكمال البدء: اختبار لإنشاء تطبيق Flutter جديد باستخدام المحرِّر أو حزمة تطوير البرامج المتكاملة المفضّلة لديك.

الخطوة 1: تثبيت أدوات سطر الأوامر المطلوبة

  1. في حال عدم إجراء ذلك من قبل، ثبِّت Firebase CLI.

  2. سجِّل الدخول إلى Firebase باستخدام حسابك على Google من خلال تنفيذ العبارة التالية:

    firebase login

  3. ثبِّت FlutterFire CLI من خلال تنفيذ الأمر التالي من أي دليل:

    dart pub global activate flutterfire_cli

الخطوة 2: ضبط إعدادات تطبيقاتك لاستخدام Firebase

استخدِم FlutterFire CLI لضبط تطبيقات Flutter من أجل الاتصال بمنصّة Firebase.

من دليل مشروع Flutter، نفِّذ الأمر التالي لبدء سير العمل في ضبط إعدادات التطبيق:

flutterfire configure


الخطوة 3: إعداد Firebase في تطبيقك

  1. من دليل مشروع Flutter، شغِّل الأمر التالي لتثبيت المكوّن الإضافي الأساسي:

    flutter pub add firebase_core

  2. من دليل مشروع Flutter، نفِّذ الأمر التالي للتأكّد من أنّ إعدادات Firebase في تطبيق Flutter محدّثة:

    flutterfire configure

  3. في ملف lib/main.dart، استورِد المكوّن الإضافي الأساسي لـ Firebase وملف الإعدادات الذي أنشأته سابقًا:

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

  4. في ملف lib/main.dart أيضًا، يمكنك إعداد Firebase باستخدام كائن DefaultFirebaseOptions الذي تم تصديره من ملف الإعدادات:

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

  5. إعادة إنشاء تطبيق Flutter:

    flutter run

إذا كنت تفضّل استخدام مشروع تجريبي، يمكنك تشغيل محاكي Firebase و في ملف lib/main.dart، يمكنك بدء Firebase باستخدام demoProjectId (من المفترض أن يبدأ بـ demo-):

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

الخطوة 4: إضافة مكوّنات إضافية في Firebase

يمكنك الوصول إلى Firebase في تطبيقك المكتوب بلغة Flutter من خلال مكوّنات Firebase Flutter الإضافية المختلفة، والتي تتوفّر لكل منتج من منتجات Firebase (مثل Cloud Firestore وAuthentication وAnalytics وما إلى ذلك).

بما أنّ Flutter هو إطار عمل متعدّد المنصات، يمكن استخدام كل مكوّن إضافي من Firebase على منصات Apple وAndroid والويب. لذلك، إذا أضفت أيّ مكوّن إضافي من Firebase إلى تطبيقك المكتوب بلغة Flutter، سيتم استخدامه من قِبل إصدارات Apple وAndroid والويب من تطبيقك.

في ما يلي كيفية إضافة مكوّن إضافي Firebase Flutter:

  1. من دليل مشروع Flutter، نفِّذ الأمر التالي:

    flutter pub add PLUGIN_NAME

  2. من دليل مشروع Flutter، نفِّذ الأمر التالي:

    flutterfire configure

    يضمن تنفيذ هذا الأمر أن تكون إعدادات Firebase في تطبيق Flutter محدّثة، ويضيف إلى تطبيقك المكوّنات الإضافية المطلوبة من Gradle لنظامَي التشغيل Crashlytics وPerformance Monitoring على Android.

  3. بعد اكتمال العملية، أعِد إنشاء مشروع Flutter باتّباع الخطوات التالية:

    flutter run

اكتملت عملية الإعداد. تم تسجيل تطبيقاتك المكتوبة باستخدام Flutter وإعدادها لاستخدام Firebase.

المكونات الإضافية المتاحة

المنتج اسم المكوّن الإضافي iOS Android الويب أجهزة Apple الأخرى
(macOS وما إلى ذلك)		 Windows
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
تجريبي
Data Connect 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
تجريبي
Vertex AI in Firebase firebase_vertexai
تجريبي

تجربة نموذج تطبيق باستخدام Analytics

مثل جميع الحِزم، يأتي المكوّن الإضافي firebase_analytics مزوّدًا بأحد أمثلة البرامج.

  1. افتح تطبيق Flutter سبق لك إعداده لاستخدام Firebase (اطّلِع على التعليمات الواردة في هذه الصفحة).

  2. انتقِل إلى دليل lib للتطبيق، ثم احذف الملف main.dart الحالي.

  3. من Google Analytics مثال على مستودع البرامج، انسخ الملفَّين التاليين والصِقهما في الدليل lib الخاص بتطبيقك:

    • main.dart
    • tabs_page.dart

  4. شغِّل تطبيق Flutter.

  5. انتقِل إلى مشروع Firebase الخاص بتطبيقك في وحدة تحكّم Firebase، ثمّ انقر على إحصاءات Google في شريط التنقّل الأيمن.

    1. انقر على لوحة البيانات. إذا كان Analytics يعمل بشكل صحيح، ستعرِض لوحة البيانات مستخدمًا نشطًا في لوحة "المستخدِمون النشطون في آخر 30 دقيقة" (قد يستغرق ذلك بعض الوقت لملء هذه اللوحة).

    2. انقر على DebugView. فعِّل الميزة لاطلاعك على جميع الأحداث التي تم إنشاؤها بواسطة مثال البرنامج.

لمزيد من المعلومات عن إعداد Analytics، يمكنك الانتقال إلى أدلة البدء لنظام التشغيل iOS والإصدارات الأحدث، Android، الويب.

الخطوات التالية