تستخدم Google تكنولوجيا الذكاء الاصطناعي لترجمة المحتوى إلى لغتك المفضّلة، وقد تتضمّن بعض الأخطاء.

بدء استخدام Firebase في مشروع Flutter

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

ثبِّت المحرِّر أو بيئة التطوير المتكاملة (IDE) المفضَّلة لديك.
ثبِّت Flutter لنظام التشغيل المحدّد، بما في ذلك ما يلي:
- حزمة تطوير البرامج (SDK) من Flutter
- المكتبات الداعمة
- البرامج وحِزم تطوير البرامج (SDK) الخاصة بالمنصة

المتطلبات الأساسية الخاصة بالمنصة:

Apple

اضبط جهاز Apple فعليًا أو استخدِم محاكيًا لتشغيل تطبيقك.
تأكَّد من أنّ تطبيق Flutter يستهدف إصدارات الأنظمة الأساسية التالية أو الإصدارات الأحدث:
- iOS 15
- الإصدار 11 من نظام التشغيل macOS

هل تريد استخدام Cloud Messaging؟

في ما يلي المتطلبات الأساسية لاستخدام "Cloud Messaging" على منصات Apple:

إعداد جهاز Apple

احصل على مفتاح مصادقة الإشعارات الفورية من Apple لحساب المطوّر على Apple.

فعِّل الإشعارات الفورية في Xcode ضمن التطبيق > الإمكانات.

Android

يجب إعداد جهاز أو محاكي لتشغيل تطبيقك. المحاكيات يجب أن تستخدم صورة محاكي مع Google Play.
تأكَّد من أنّ تطبيقك يستوفي المتطلبات التالية:
- يستهدف المستوى 24 من واجهة برمجة التطبيقات (Nougat) أو الإصدارات الأحدث
- يستخدم الإصدار 7.0 من نظام التشغيل Android أو إصدارًا أحدث

الويب

ما مِن متطلبات أساسية خاصة بالمنصة

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

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

ثبِّت واجهة سطر الأوامر (CLI) في Firebase إذا لم يسبق لك ذلك.
سجِّل الدخول إلى Firebase باستخدام حساب Google من خلال تنفيذ الأمر التالي:
```
firebase login
```
ثبِّت واجهة سطر أوامر FlutterFire من خلال تنفيذ الأمر التالي من أي دليل:
```
dart pub global activate flutterfire_cli
```

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

استخدِم واجهة سطر الأوامر FlutterFire لضبط تطبيقات Flutter للاتصال بـ Firebase.

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

flutterfire configure

ما هي وظيفة سير العمل flutterfire configure هذا؟

ينفّذ سير عمل flutterfire configure ما يلي:

يطلب منك اختيار الأنظمة الأساسية (iOS وAndroid والويب) المتوافقة مع تطبيق Flutter. لكل نظام أساسي يتم اختياره، تنشئ واجهة سطر الأوامر FlutterFire تطبيق Firebase جديدًا في مشروع Firebase.

يمكنك اختيار استخدام مشروع حالي على Firebase أو إنشاء مشروع جديد. إذا سبق لك تسجيل تطبيقات في مشروع حالي على Firebase، ستحاول واجهة سطر الأوامر FlutterFire مطابقتها استنادًا إلى إعدادات مشروع Flutter الحالي.

ملاحظة: إليك بعض النصائح حول إعداد مشروع Firebase وإدارته:

اطّلِع على أفضل الممارسات لإضافة التطبيقات إلى مشروع Firebase، بما في ذلك كيفية التعامل مع صِيَغ متعددة.

فعِّل Google Analytics في مشروعك، ما يوفّر تجربة مثالية باستخدام العديد من منتجات Firebase، مثل Crashlytics وRemote Config.

ينشئ ملف إعداد Firebase (firebase_options.dart) ويضيفه إلى دليل lib/.

ملاحظة: يحتوي ملف إعداد Firebase هذا على معرّفات فريدة، ولكن غير سرية، لكل نظام أساسي اخترته.
يمكنك الانتقال إلى صفحة فهم مشاريع Firebase لمعرفة المزيد عن ملف الإعداد هذا.

(بالنسبة إلى Crashlytics أو Performance Monitoring على Android) يضيف المكوّنات الإضافية المطلوبة لنظام Gradle الخاصة بالمنتج إلى تطبيق Flutter.

ملاحظة: لكي تضيف واجهة سطر الأوامر FlutterFire المكوّن الإضافي المناسب لـ Gradle، يجب أن يكون المكوّن الإضافي Flutter الخاص بالمنتج قد تم استيراده إلى تطبيق Flutter.

بعد تشغيل flutterfire configure لأول مرة، عليك إعادة تشغيل الأمر في أي وقت:

ابدأ بإتاحة منصة جديدة في تطبيق Flutter.
بدء استخدام خدمة أو منتج جديدَين من Firebase في تطبيق Flutter، خاصةً إذا بدأت في استخدام ميزة "تسجيل الدخول باستخدام حساب Google" أو Crashlytics أو Performance Monitoring أو Realtime Database

تضمن إعادة تشغيل الأمر أن تكون إعدادات Firebase لتطبيق Flutter محدّثة، وتضيف تلقائيًا أي مكوّنات إضافية مطلوبة من Gradle إلى تطبيقك (بالنسبة إلى Android).

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

من دليل مشروع Flutter، نفِّذ الأمر التالي لتثبيت المكوّن الإضافي الأساسي:
```
flutter pub add firebase_core
```
من دليل مشروع Flutter، نفِّذ الأمر التالي للتأكّد من أنّ إعدادات Firebase لتطبيق Flutter محدَّثة:
```
flutterfire configure
```
في ملف lib/main.dart، استورِد المكوّن الإضافي الأساسي لخدمة Firebase وملف الإعداد الذي أنشأته سابقًا:
```
import 'package:firebase_core/firebase_core.dart';
import 'firebase_options.dart';
```
في ملف lib/main.dart أيضًا، عليك إعداد Firebase باستخدام عنصر DefaultFirebaseOptions الذي تم تصديره من خلال ملف الإعداد:
```
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp(
  options: DefaultFirebaseOptions.currentPlatform,
);
runApp(const MyApp());
```
أعِد إنشاء تطبيق 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 الإضافي:

من دليل مشروع Flutter، نفِّذ الأمر التالي:
```
flutter pub add PLUGIN_NAME
```
من دليل مشروع Flutter، نفِّذ الأمر التالي:
```
flutterfire configure
```
يضمن تنفيذ هذا الأمر أنّ إعدادات Firebase لتطبيق Flutter محدَّثة، ويضيف المكوّنات الإضافية المطلوبة في Gradle إلى تطبيقك لكل من Crashlytics وPerformance Monitoring على Android.
بعد اكتمال عملية التثبيت، أعِد إنشاء مشروع Flutter:
```
flutter run
```

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

اعتبارات خاصة لإنشاء تطبيقات الويب

راجِع خيارات الإعداد التالية عند استهداف منصة الويب.

التوافق مع "الأنواع الموثوق بها"

تتيح حزمة Firebase SDK لـ Flutter استخدام Trusted Types للمساعدة في منع هجمات XSS المستنِدة إلى DOM (من جهة العميل). عند تفعيل إجراء التنفيذ "النوع الموثوق به" لتطبيقك، تُدخِل حزمة تطوير البرامج (SDK) لمنصّة Firebase نصوصها البرمجية في نموذج DOM باستخدام سياسات "النوع الموثوق به" المخصّصة، مثل flutterfire-firebase_core وflutterfire-firebase_auth وما إلى ذلك.

إيقاف ميزة "الحقن التلقائي" في Firebase JavaScript SDK

بشكل تلقائي، تُدخِل حزمة Firebase Flutter SDK حزمة Firebase JavaScript SDK تلقائيًا عند إنشاء تطبيق للويب. إذا كنت لا تريد أن يتم حقن حزمة تطوير البرامج (SDK) لـ Firebase JavaScript تلقائيًا، يمكنك إجراء ما يلي:

تجاهَل نص الإدخال التلقائي من خلال إضافة السمة التالية داخل علامة <script> في ملف web/index.html في مشروع Flutter:

<!-- 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'];

حمِّل النص البرمجي يدويًا باستخدام أحد الخيارات التالية:

الخيار 1: أضِف حزمة SDK بشكل صريح إلى ملف web/index.html، داخل دالة الاستدعاء window.addEventListener:

  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

الخيار 2: نزِّل رمز حزمة Firebase JavaScript SDK للمكوّن الإضافي من نطاق gstatic، واحفظه في ملف 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

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

المنتج	اسم المكوِّن الإضافي	أجهزة Apple الأخرى (macOS، وما إلى ذلك)	Windows
Firebase AI Logic ¹	`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 ²	`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".}

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

يمكنك اكتساب خبرة عملية من خلال الدرس التطبيقي حول الترميز في Firebase Flutter.
استعِدّ لإطلاق تطبيقك:
- يمكنك إعداد تنبيهات بشأن الميزانية لمشروعك في وحدة تحكّم Google Cloud.
- يمكنك مراقبة لوحة بيانات الاستخدام والفوترة في وحدة تحكّم Firebase للحصول على نظرة عامة على استخدام مشروعك في خدمات Firebase المتعدّدة.
- راجِع قائمة التحقّق من إطلاق Firebase.