Google 致力于为黑人社区推动种族平等。查看具体举措

تعرف على المزيد حول الويب و Firebase

أثناء قيامك بتطوير تطبيق ويب باستخدام Firebase ، قد تواجه مفاهيم غير مألوفة أو مناطق تحتاج فيها إلى مزيد من المعلومات لاتخاذ القرارات الصحيحة لمشروعك. تهدف هذه الصفحة إلى الإجابة على هذه الأسئلة أو توجيهك إلى الموارد لمعرفة المزيد.

إذا كانت لديك أسئلة حول موضوع لم يتم تناوله في هذه الصفحة ، فتفضل بزيارة أحد مجتمعاتنا عبر الإنترنت . سنقوم أيضًا بتحديث هذه الصفحة بموضوعات جديدة بشكل دوري ، لذا تحقق مرة أخرى لمعرفة ما إذا كنا قد أضفنا الموضوع الذي تريد التعرف عليه.

الإصداران 8 و 9 من SDK

يوفر Firebase إصدارين من SDK لتطبيقات الويب ، أحدهما في الإصدار التجريبي حاليًا:

  • الإصدار 8. هذه هي واجهة JavaScript التي احتفظ بها Firebase لعدة سنوات وهي مألوفة لمطوري الويب مع تطبيقات Firebase الحالية.
  • الإصدار المعياري 9 (تجريبي) . يقدم SDK هذا نهجًا معياريًا يوفر حجم SDK منخفضًا وكفاءة أكبر باستخدام أدوات إنشاء JavaScript الحديثة مثل Webpack أو Rollup .

يتكامل الإصدار 9 جيدًا مع أدوات الإنشاء التي تزيل التعليمات البرمجية التي لا يتم استخدامها في تطبيقك ، وهي عملية تُعرف باسم "اهتزاز الشجرة". تستفيد التطبيقات التي تم إنشاؤها باستخدام SDK من آثار أقدام صغيرة الحجم بشكل كبير. الإصدار 8 ، على الرغم من توفره كوحدة نمطية ، لا يحتوي على هيكل معياري صارم ولا يوفر نفس الدرجة من تقليل الحجم.

على الرغم من أن غالبية الإصدار 9 SDK يتبع نفس أنماط الإصدار 8 ، إلا أن تنظيم الكود مختلف. بشكل عام ، يتم توجيه الإصدار 8 نحو مساحة الاسم ونمط الخدمة ، بينما يتم توجيه الإصدار 9 نحو الوظائف المنفصلة. على سبيل المثال، الإصدار 8 من نقطة-تسلسل، مثل firebaseApp.auth() ، يتم استبدال في الإصدار 9 من قبل واحدة getAuth() وظيفة التي تأخذ firebaseApp والعوائد مثيل مصادقة.

هذا يعني أن تطبيقات الويب التي تم إنشاؤها بالإصدار 8 أو إصدار أقدم تتطلب إعادة بناء ديون من أجل الاستفادة من النهج المعياري للإصدار 9. يوفر Firebase مكتبات متوافقة لتسهيل هذا الانتقال ؛ راجع دليل الترقية للحصول على مزيد من التفاصيل.

ما المدعوم؟

بينما يحتوي الإصدار 8 والإصدار 9 (بيتا) على أنماط تعليمات برمجية مختلفة ، إلا أنهما يوفران دعمًا مشابهًا جدًا لميزات وخيارات Firebase. كما سنشرح بالتفصيل في هذا الدليل ، يدعم كلا الإصدارين من SDK متغيرات JavaScript و Node.js بالإضافة إلى العديد من الخيارات لإضافة / تثبيت حزم SDK.

إضافة SDKs مع 8.0 (ذات مساحة الاسم) 9.0 (بيتا معياري)
npm
  • لجافا سكريبت
  • بالنسبة إلى Node.js
  • لجافا سكريبت
  • بالنسبة إلى Node.js
CDN (شبكة توصيل المحتوى)
  • لجافا سكريبت
  • لجافا سكريبت
استضافة المواقع
  • لجافا سكريبت
  • بالنسبة إلى Node.js
  • سيتوفر قريبًا لـ JavaScript و Node.js

لمزيد من المعلومات ، راجع طرق إضافة Web SDKs إلى تطبيقك ومتغيرات Firebase Web SDK لاحقًا في هذه الصفحة.

الإصدار 9 للتطبيقات الجديدة

إذا كنت تبدأ في تكامل جديد مع Firebase ، فيمكنك الاشتراك في الإصدار 9 Beta SDK عند إضافة SDK وتهيئته .

أثناء تطوير تطبيقك ، ضع في اعتبارك أنه سيتم تنظيم شفرتك بشكل أساسي حول الوظائف . في الإصدار 9 ، يتم تمرير الخدمات كوسيطة أولى ، ثم تستخدم الوظيفة تفاصيل الخدمة للقيام بالباقي. على سبيل المثال:

import { getAuth, onAuthStateChanged } from "firebase/auth";

const auth = getAuth(firebaseApp);
onAuthStateChanged(auth, user => {
  // Check for user status
});

لمزيد من الأمثلة والتفاصيل ، راجع الأدلة الخاصة بكل مجال منتج بالإضافة إلى الوثائق المرجعية للإصدار 9 .

طرق لإضافة Web SDKs إلى تطبيقك

يوفر Firebase مكتبات JavaScript لمعظم منتجات Firebase ، بما في ذلك Remote Config و FCM والمزيد. تعتمد كيفية إضافة Firebase SDKs إلى تطبيق الويب الخاص بك على ما إذا كنت قد اخترت استخدام Firebase Hosting لتطبيقك ، أو ما هي الأدوات التي تستخدمها مع تطبيقك (مثل مجموعة الوحدات النمطية) ، أو إذا كان تطبيقك يعمل في غير متصفح بيئة مثل Node.js.

يمكنك إضافة أي من المكتبات المتاحة إلى تطبيقك عبر إحدى الطرق المدعومة:

  • npm (لحزم الوحدات و Node.js)
  • CDN (شبكة توصيل المحتوى)
  • عناوين URL لاستضافة Firebase

للحصول على تعليمات الإعداد التفصيلية لكل طريقة ، راجع إضافة Firebase إلى تطبيق JavaScript . يحتوي الجزء المتبقي من هذا القسم على معلومات لمساعدتك في الاختيار من بين الخيارات المتاحة.

npm

يوفر لك تنزيل حزمة Firebase npm (التي تتضمن كلاً من حزم المتصفح و Node.js) نسخة محلية من Firebase SDK ، والتي قد تكون ضرورية للتطبيقات التي لا تستخدم المتصفح مثل تطبيقات Node.js أو React Native أو Electron. يتضمن التنزيل حزم Node.js و React Native كخيار لبعض الحزم. تعد حزم Node.js ضرورية لخطوة عرض جانب الخادم (SSR) لأطر عمل SSR.

يوفر استخدام npm مع وحدة تجميع وحدات مثل Webpack أو Rollup خيارات تحسين للشفرة غير المستخدمة "اهتزاز الشجرة" وتطبيق polyfills المستهدفة ، والتي يمكن أن تقلل بشكل كبير من حجم تطبيقك. قد يضيف تنفيذ هذه الميزات بعض التعقيد إلى سلسلة التكوين والبناء الخاصة بك ، ولكن يمكن أن تساعد أدوات CLI السائدة المختلفة في التخفيف من ذلك. تتضمن هذه الأدوات Angular و React و Vue و Next وغيرها.

باختصار:

  • يوفر تحسينًا قيمًا لحجم التطبيق
  • الأدوات القوية متاحة لإدارة الوحدات
  • مطلوب لـ SSR مع Node.js

CDN (شبكة توصيل المحتوى)

تعد إضافة مكتبات مخزنة على شبكة CDN الخاصة بـ Firebase طريقة إعداد SDK بسيطة قد تكون مألوفة للعديد من المطورين. باستخدام CDN لإضافة حزم SDK ، لن تحتاج إلى أداة بناء ، وقد تميل سلسلة الإنشاء إلى أن تكون أبسط وأسهل في العمل مقارنة بمجمعات الوحدات النمطية. إذا لم تكن مهتمًا بشكل خاص بالحجم المثبت لتطبيقك ولم يكن لديك متطلبات خاصة مثل التحويل من TypeScript ، فقد يكون CDN خيارًا جيدًا.

باختصار:

  • مألوف وبسيط
  • مناسب عندما لا يكون حجم التطبيق مصدر قلق كبير
  • مناسب عندما لا يستخدم موقع الويب الخاص بك أدوات البناء.

استضافة المواقع

يوفر Firebase Hosting عناوين URL محفوظة تتيح لك تحسين الأداء عن طريق تحميل الملفات من نفس المصدر. إذا كنت تستخدم بالفعل أو تخطط لاستخدام Firebase Hosting في تطبيقك ، فيمكنك إضافة JavaScript SDKs عبر عناوين URL للاستضافة والاستفادة من مكاسب الأداء هذه. بالإضافة إلى ذلك ، تدعم هذه الطريقة التهيئة التلقائية لـ SDK ، والتي يمكن أن تبسط إدارة بيئات متعددة مثل التطوير والتشغيل المرحلي والإنتاج. تعرف على المزيد حول إضافة حزم SDK عبر عناوين URL للاستضافة المحجوزة .

باختصار:

  • يوفر ميزة أداء طفيفة على CDN
  • يمكن تبسيط العمل في بيئات تطوير متعددة
  • مناسب للتطبيقات التي تستخدم بالفعل استضافة Firebase

متغيرات Firebase Web SDK

حاليًا ، يوفر Firebase نوعين مختلفين من Web SDK:

  • حزمة JavaScript تدعم جميع ميزات Firebase للاستخدام في المتصفح.
  • حزمة Node.js من جانب العميل تدعم العديد من ميزات Firebase وليس كلها. انظر قائمة البيئات المدعومة .

تم تصميم كلا هذين المتغيرين من SDK للمساعدة في إنشاء تطبيقات الويب أو تطبيقات العميل لوصول المستخدم النهائي ، كما هو الحال في سطح المكتب Node.js أو تطبيق IoT. إذا كان هدفك هو إعداد الوصول الإداري من البيئات ذات الامتيازات (مثل الخوادم) ، فاستخدم Firebase Admin SDK بدلاً من ذلك.

الكشف عن البيئة مع الحزم والأطر

عند تثبيت Firebase Web SDK باستخدام npm ، يتم تثبيت إصدارات JavaScript و Node.js. توفر الحزمة الكشف التفصيلي عن البيئة لتمكين الحزم المناسبة لتطبيقك.

إذا كانت التعليمات البرمجية الخاصة بك تستخدم عبارات require Node.js ، فستجد SDK الحزمة الخاصة بالعقدة. بخلاف ذلك ، يجب تحديد إعدادات المجمّع بشكل صحيح لاكتشاف حقل نقطة الإدخال الصحيح في ملف package.json (على سبيل المثال ، main أو browser أو module ). إذا واجهت أخطاء وقت تشغيل مع SDK ، فتحقق للتأكد من تكوين الحزمة الخاصة بك لإعطاء الأولوية لنوع الحزمة الصحيح لبيئتك.

المكتبات المتاحة

خيارات الإعداد الإضافية

تأخير تحميل حزم Firebase SDK (من CDN)

يمكنك تأخير تضمين Firebase SDKs حتى يتم تحميل الصفحة بأكملها.

  1. أضف علامة defer إلى كل علامة script لحزم Firebase SDK ، ثم قم بتأجيل تهيئة Firebase باستخدام نص برمجي ثانٍ ، على سبيل المثال:

    <script defer src="https://www.gstatic.com/firebasejs/8.6.8/firebase-app.js"></script>
    
    <script defer src="https://www.gstatic.com/firebasejs/8.6.8/firebase-auth.js"></script>
    <script defer src="https://www.gstatic.com/firebasejs/8.6.8/firebase-firestore.js"></script>
    
    // ...
    
    <script defer src="./init-firebase.js"></script>
    
  2. قم بإنشاء ملف init-firebase.js ، ثم قم بتضمين ما يلي في الملف:

    // TODO: Replace the following with your app's Firebase project configuration
    var firebaseConfig = {
      // ...
    };
    
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
    

استخدم مشاريع Firebase متعددة في تطبيق واحد

في معظم الحالات ، ما عليك سوى تهيئة Firebase في تطبيق افتراضي واحد. يمكنك الوصول إلى Firebase من هذا التطبيق بطريقتين مكافئتين:

// Initialize Firebase with a "default" Firebase project
var defaultProject = firebase.initializeApp(firebaseConfig);

console.log(defaultProject.name);  // "[DEFAULT]"

// Option 1: Access Firebase services via the defaultProject variable
var defaultStorage = defaultProject.storage();
var defaultFirestore = defaultProject.firestore();

// Option 2: Access Firebase services using shorthand notation
defaultStorage = firebase.storage();
defaultFirestore = firebase.firestore();

ومع ذلك ، في بعض الأحيان ، تحتاج إلى الوصول إلى العديد من مشاريع Firebase في نفس الوقت. على سبيل المثال ، قد ترغب في قراءة البيانات من قاعدة البيانات الخاصة بمشروع Firebase ولكن تخزين الملفات في مشروع Firebase مختلف. أو قد ترغب في مصادقة مشروع واحد مع الإبقاء على مشروع ثانٍ غير مصدق.

يسمح لك Firebase JavaScript SDK بتهيئة واستخدام مشاريع Firebase متعددة في تطبيق واحد في نفس الوقت ، مع استخدام كل مشروع لمعلومات تكوين Firebase الخاصة به.

// Initialize Firebase with a default Firebase project
firebase.initializeApp(firebaseConfig);

// Initialize Firebase with a second Firebase project
var otherProject = firebase.initializeApp(otherProjectFirebaseConfig, "other");

console.log(firebase.app().name);  // "[DEFAULT]"
console.log(otherProject.name);    // "otherProject"

// Use the shorthand notation to access the default project's Firebase services
var defaultStorage = firebase.storage();
var defaultFirestore = firebase.firestore();

// Use the otherProject variable to access the second project's Firebase services
var otherStorage = otherProject.storage();
var otherFirestore = otherProject.firestore();

قم بتشغيل خادم ويب محلي للتطوير

إذا كنت تقوم بإنشاء تطبيق ويب ، فإن بعض أجزاء Firebase JavaScript SDK تتطلب أن تخدم تطبيق الويب الخاص بك من خادم بدلاً من نظام الملفات المحلي. يمكنك استخدام Firebase CLI لتشغيل خادم محلي.

إذا قمت بالفعل بإعداد Firebase Hosting لتطبيقك ، فربما تكون قد أكملت بالفعل العديد من الخطوات أدناه.

لخدمة تطبيق الويب الخاص بك ، ستستخدم Firebase CLI ، وهي أداة سطر أوامر.

  1. قم بزيارة وثائق Firebase CLI للتعرف على كيفية تثبيت CLI أو التحديث إلى أحدث إصدار .

  2. ابدأ مشروع Firebase. قم بتشغيل الأمر التالي من جذر دليل التطبيق المحلي الخاص بك:

    firebase init

  3. بدء تشغيل الخادم المحلي من أجل التنمية. قم بتشغيل الأمر التالي من جذر دليل التطبيق المحلي الخاص بك:

    firebase serve

مصادر مفتوحة المصدر لحزم Firebase JavaScript SDK

يدعم Firebase تطوير المصدر المفتوح ، ونحن نشجع مساهمات المجتمع وتعليقاته.

حزم SDK لجافا سكريبت Firebase

تم تطوير معظم حزم SDK من Firebase JavaScript كمكتبات مفتوحة المصدر في مستودع Firebase GitHub العام.

عينات البدء السريع

يحتفظ Firebase بمجموعة من عينات البدء السريع لمعظم واجهات برمجة تطبيقات Firebase على الويب. ابحث عن هذه الخطوات السريعة في مستودع Firebase GitHub السريع العام . يمكنك استخدام هذه الخطوات السريعة كنموذج رمز لاستخدام حزم Firebase SDK.