Firebase Android Codelab - بناء محادثة ودية

لقطة شاشة

الصورة: العمل ودية الدردشة التطبيق.

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

ماذا ستتعلم

  • كيفية استخدام مصادقة Firebase للسماح للمستخدمين بتسجيل الدخول.
  • كيفية مزامنة البيانات باستخدام قاعدة بيانات Firebase Realtime.
  • كيفية تخزين الملفات الثنائية في Cloud Storage for Firebase.
  • كيفية استخدام Firebase Local Emulator Suite لتطوير تطبيق Android باستخدام Firebase.

ماذا ستحتاج

استنساخ المستودع

استنساخ مستودع GitHub من سطر الأوامر:

$ git clone https://github.com/firebase/codelab-friendlychat-android

قم بالاستيراد إلى Android Studio

في الروبوت ستوديو، حدد ملف> فتح، ثم حدد build-android-start الدليل ( android_studio_folder ) من الدليل حيث قمت بتنزيل نموذج التعليمات البرمجية.

يجب عليك الآن أن build-android-start مشروع مفتوح في الروبوت الاستوديو. إذا كنت ترى تحذيرا حول google-services.json ملف المفقودين، لا تقلق. ستتم إضافته في خطوة لاحقة.

تحقق من التبعيات

في مختبر الرموز هذا ، تمت إضافة جميع التبعيات التي ستحتاج إليها بالفعل من أجلك ، ولكن من المهم فهم كيفية إضافة Firebase SDK إلى تطبيقك:

بناء

buildscript {
    // ...

    dependencies {
        classpath 'com.android.tools.build:gradle:4.1.2'

        // The google-services plugin is required to parse the google-services.json file
        classpath 'com.google.gms:google-services:4.3.5'
    }
}

app / build.gradle

plugins {
    id 'com.android.application'
    id 'kotlin-android'
    id 'com.google.gms.google-services'
}

android {
    // ...
}

dependencies {
    // ...

    // Google Sign In SDK
    implementation 'com.google.android.gms:play-services-auth:19.0.0'

    // Firebase SDK
    implementation platform('com.google.firebase:firebase-bom:26.6.0')
    implementation 'com.google.firebase:firebase-database-ktx'
    implementation 'com.google.firebase:firebase-storage-ktx'
    implementation 'com.google.firebase:firebase-auth-ktx'

    // Firebase UI Library
    implementation 'com.firebaseui:firebase-ui-auth:7.2.0'
    implementation 'com.firebaseui:firebase-ui-database:7.2.0'
}

من أجل تشغيل المحاكي جناح Firebase ، تحتاج إلى تثبيت واستخدام Firebase CLI .

قم بتثبيت CLI

الخيار 1 - التثبيت باستخدام npm

إذا كان لديك Node.js و npm مثبتان بالفعل على جهازك ، فيمكنك تثبيت CLI باستخدام الأمر التالي:

npm install -g firebase-tools@latest

الخيار 2 - تثبيت ثنائي مستقل

إذا لم يكن لديك نود.جي إس / الآلية الوقائية الوطنية أو كنت جديدا على تطوير التطبيق، يمكنك تثبيت CLI كما ثنائي مستقل بعد تعليمات النظام الأساسي الخاص بك هنا .

تحقق من التثبيت

وبمجرد الانتهاء من Firebase CLI المثبتة، قم بتشغيل الأمر التالي للتأكد من لديك الإصدار 9.11.0 أو أعلى:

firebase --version

ابدأ المحاكيات

في المحطة الطرفية، قم بتشغيل الأمر التالي من جذر المحلي codelab-friendlychat-android الدليل:

firebase emulators:start --project=demo-friendlychat-android

يجب أن ترى بعض السجلات مثل هذا. وقد تم تحديد القيم ميناء في firebase.json الملف، والذي أدرج في نموذج التعليمات البرمجية المستنسخة.

$ firebase emulators:start --project=demo-friendlychat-android
i  emulators: Starting emulators: auth, database, storage
i  emulators: Detected demo project ID "demo-friendlychat-android", emulated services will use a demo configuration and attempts to access non-emulated services for this project will fail.
i  database: Database Emulator logging to database-debug.log
i  ui: Emulator UI logging to ui-debug.log

┌─────────────────────────────────────────────────────────────┐
│ ✔  All emulators ready! It is now safe to connect your app. │
│ i  View Emulator UI at http://localhost:4000                │
└─────────────────────────────────────────────────────────────┘

┌────────────────┬────────────────┬────────────────────────────────┐
│ Emulator       │ Host:Port      │ View in Emulator UI            │
├────────────────┼────────────────┼────────────────────────────────┤
│ Authentication │ localhost:9099 │ http://localhost:4000/auth     │
├────────────────┼────────────────┼────────────────────────────────┤
│ Database       │ localhost:9000 │ http://localhost:4000/database │
├────────────────┼────────────────┼────────────────────────────────┤
│ Storage        │ localhost:9199 │ http://localhost:4000/storage  │
└────────────────┴────────────────┴────────────────────────────────┘
  Emulator Hub running at localhost:4400
  Other reserved ports: 4500

Issues? Report them at https://github.com/firebase/firebase-tools/issues and attach the *-debug.log files.

انتقل إلى HTTP: // المضيف المحلي: 4000 في متصفح الويب الخاص بك لعرض Firebase المحاكي جناح UI:

الصفحة الرئيسية لـ Emulator Suite UI

مغادرة emulators:start القيادة لتشغيل بقية codelab.

ربط التطبيق الخاص بك

في الروبوت ستوديو، مفتوحة MainActivity.kt ، قم بإضافة التعليمة البرمجية التالية داخل onCreate الأسلوب:

// When running in debug mode, connect to the Firebase Emulator Suite.
// "10.0.2.2" is a special IP address which allows the Android Emulator
// to connect to "localhost" on the host computer. The port values (9xxx)
// must match the values defined in the firebase.json file.
if (BuildConfig.DEBUG) {
    Firebase.database.useEmulator("10.0.2.2", 9000)
    Firebase.auth.useEmulator("10.0.2.2", 9099)
    Firebase.storage.useEmulator("10.0.2.2", 9199)
}

أضف google-services.json

من أجل التطبيق الروبوت الخاص بك للاتصال Firebase، يجب إضافة google-services.json ملف داخل app مجلد من مشروع Android. لأغراض معمل الرموز هذا ، قدمنا ​​ملف JSON وهمي سيسمح لك بالاتصال بمجموعة Firebase Emulator Suite.

نسخ mock-google-services.json الملف إلى build-android-start/app المجلد مثل google-services.json :

cp mock-google-services.json build-android-start/app/google-services.json

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

قم بتشغيل التطبيق

الآن بعد أن قمت باستيراد المشروع إلى Android Studio وإضافة ملف JSON لتهيئة Firebase ، فأنت جاهز لتشغيل التطبيق لأول مرة.

  1. ابدأ تشغيل Android Emulator.
  2. في الروبوت ستوديو، انقر فوق تشغيل (ينفذ ) في شريط الأدوات.

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

سيستخدم هذا التطبيق قاعدة بيانات Firebase Realtime لتخزين جميع رسائل الدردشة. قبل أن نضيف البيانات ، يجب أن نتأكد من أن التطبيق آمن وأن المستخدمين المصادق عليهم فقط هم من يمكنهم نشر الرسائل. في هذه الخطوة ، سنقوم بتمكين مصادقة Firebase وتهيئة قواعد أمان قاعدة البيانات في الوقت الفعلي.

أضف وظيفة تسجيل الدخول الأساسية

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

تحقق من وجود المستخدم الحالي

أولا إضافة متغير المثيل التالي إلى MainActivity.kt الفئة:

MainActivity.kt

// Firebase instance variables
private lateinit var auth: FirebaseAuth

الآن دعونا تعديل MainActivity لإرسال المستخدم إلى شاشة تسجيل الدخول كلما فتح التطبيق وتكون غير المصادق. إضافة ما يلي إلى onCreate() طريقة بعد binding تعلق القائل:

MainActivity.kt

// Initialize Firebase Auth and check if the user is signed in
auth = Firebase.auth
if (auth.currentUser == null) {
    // Not signed in, launch the Sign In activity
    startActivity(Intent(this, SignInActivity::class.java))
    finish()
    return
}

نحن نريد أيضا للتحقق مما إذا تم توقيع المستخدم في أثناء onStart() :

MainActivity.kt

public override fun onStart() {
    super.onStart()
    // Check if user is signed in.
    if (auth.currentUser == null) {
        // Not signed in, launch the Sign In activity
        startActivity(Intent(this, SignInActivity::class.java))
        finish()
        return
    }
}

ثم تنفيذ getUserPhotoUrl() و getUserName() طرق للعودة المعلومات المناسبة حول المستخدم Firebase مصادقة حاليا:

MainActivity.kt

private fun getPhotoUrl(): String? {
    val user = auth.currentUser
    return user?.photoUrl?.toString()
}

private fun getUserName(): String? {
    val user = auth.currentUser
    return if (user != null) {
        user.displayName
    } else ANONYMOUS
}

ثم تنفيذ signOut() طريقة للتعامل مع تسجيل الخروج زر:

MainActivity.kt

private fun signOut() {
    AuthUI.getInstance().signOut()
    startActivity(Intent(this, SignInActivity::class.java))
    finish()
}

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

قم بتنفيذ شاشة تسجيل الدخول

فتح ملف SignInActivity.kt . هنا يتم استخدام زر تسجيل دخول بسيط لبدء المصادقة. في هذا القسم ، ستستخدم FirebaseUI لتنفيذ منطق تسجيل الدخول.

إضافة مثيل متغير أصيل في SignInActivity الطبقة تحت // Firebase instance variables تعليق:

SignInActivity.kt

// Firebase instance variables
private lateinit var auth: FirebaseAuth

ثم، تحرير و onCreate() طريقة لتهيئة Firebase بنفس الطريقة التي فعلت في MainActivity :

SignInActivity.kt

// Initialize FirebaseAuth
auth = Firebase.auth

إضافة ActivityResultLauncher ميدانية ل SignInActivity :

SignInActivity.kt

// ADD THIS
private val signIn: ActivityResultLauncher<Intent> =
        registerForActivityResult(FirebaseAuthUIActivityResultContract(), this::onSignInResult)

override fun onCreate(savedInstanceState: Bundle?) {
    // ...
}

بعد ذلك، تحرير و onStart() طريقة لبدء علامة FirebaseUI في التدفق:

SignInActivity.kt

public override fun onStart() {
    super.onStart()

    // If there is no signed in user, launch FirebaseUI
    // Otherwise head to MainActivity
    if (Firebase.auth.currentUser == null) {
        // Sign in with FirebaseUI, see docs for more details:
        // https://firebase.google.com/docs/auth/android/firebaseui
        val signInIntent = AuthUI.getInstance()
                .createSignInIntentBuilder()
                .setLogo(R.mipmap.ic_launcher)
                .setAvailableProviders(listOf(
                        AuthUI.IdpConfig.EmailBuilder().build(),
                        AuthUI.IdpConfig.GoogleBuilder().build(),
                ))
                .build()

        signIn.launch(signInIntent)
    } else {
        goToMainActivity()
    }
}

بعد ذلك، تنفيذ onSignInResult طريقة للتعامل مع علامة في النتيجة. إذا كانت النتيجة من تسجيل الدخول من ناجحة، ومواصلة MainActivity :

SignInActivity.kt

private fun onSignInResult(result: FirebaseAuthUIAuthenticationResult) {
    if (result.resultCode == RESULT_OK) {
        Log.d(TAG, "Sign in successful!")
        goToMainActivity()
    } else {
        Toast.makeText(
                this,
                "There was an error signing in",
                Toast.LENGTH_LONG).show()

        val response = result.idpResponse
        if (response == null) {
            Log.w(TAG, "Sign in canceled")
        } else {
            Log.w(TAG, "Sign in error", response.error)
        }
    }
}

هذا كل شيء! لقد نفذت المصادقة مع FirebaseUI في بضع استدعاءات للطريقة ودون الحاجة إلى إدارة أي تكوين من جانب الخادم.

اختبر عملك

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

بعد تسجيل الدخول، افتح Firebase المحاكي جناح واجهة المستخدم في المتصفح الخاص بك، ثم انقر فوق علامة التبويب مصادقة لرؤية هذا وقع في أول حساب المستخدم.

في هذه الخطوة ، سنضيف وظائف لقراءة وعرض الرسائل المخزنة في قاعدة بيانات Realtime.

استيراد رسائل نموذجية

  1. في Firebase المحاكي جناح UI، حدد علامة التبويب قاعدة البيانات في الوقت الحقيقي.
  2. سحب وإسقاط initial_messages.json الملف من النسخة المحلية من مستودع codelab في المشاهد البيانات.

يجب عليك الآن بعض الرسائل تحت messages عقدة من قاعدة البيانات.

إقرأ البيانات

مزامنة الرسائل

في هذا القسم ، نضيف رمزًا يزامن الرسائل المضافة حديثًا إلى واجهة مستخدم التطبيق من خلال:

  • تهيئة قاعدة بيانات Firebase Realtime وإضافة مستمع للتعامل مع التغييرات التي تم إجراؤها على البيانات.
  • تحديث RecyclerView محول ذلك سيتم عرض الرسائل الجديدة.
  • مضيفا المتغيرات المثال قاعدة البيانات الخاصة بك مع غيرها من المتغيرات المثال Firebase في MainActivity الفئة:

MainActivity.kt

// Firebase instance variables
// ...
private lateinit var db: FirebaseDatabase
private lateinit var adapter: FriendlyMessageAdapter

تعديل MainActivity الخاص بك onCreate() طريقة في ظل تعليق // Initialize Realtime Database and FirebaseRecyclerAdapter برمز محدد أدناه. ويضيف هذا الرمز كل الرسائل الموجودة من قاعدة البيانات في الوقت الحقيقي ومن ثم يستمع لمدخلات فرعية جديدة في إطار messages مسار في قاعدة البيانات Firebase الحقيقي الخاص بك. يضيف عنصرًا جديدًا إلى واجهة المستخدم لكل رسالة:

MainActivity.kt

// Initialize Realtime Database
db = Firebase.database
val messagesRef = db.reference.child(MESSAGES_CHILD)

// The FirebaseRecyclerAdapter class and options come from the FirebaseUI library
// See: https://github.com/firebase/FirebaseUI-Android
val options = FirebaseRecyclerOptions.Builder<FriendlyMessage>()
    .setQuery(messagesRef, FriendlyMessage::class.java)
    .build()
adapter = FriendlyMessageAdapter(options, getUserName())
binding.progressBar.visibility = ProgressBar.INVISIBLE
manager = LinearLayoutManager(this)
manager.stackFromEnd = true
binding.messageRecyclerView.layoutManager = manager
binding.messageRecyclerView.adapter = adapter

// Scroll down when a new message arrives
// See MyScrollToBottomObserver for details
adapter.registerAdapterDataObserver(
    MyScrollToBottomObserver(binding.messageRecyclerView, adapter, manager)
)

التالي في FriendlyMessageAdapter.kt الطبقة تنفيذ bind() طريقة داخل الطبقة الداخلية MessageViewHolder() :

FriendlyMessageAdapter.kt

inner class MessageViewHolder(private val binding: MessageBinding) : ViewHolder(binding.root) {
    fun bind(item: FriendlyMessage) {
        binding.messageTextView.text = item.text
        setTextColor(item.name, binding.messageTextView)

        binding.messengerTextView.text = if (item.name == null) ANONYMOUS else item.name
        if (item.photoUrl != null) {
            loadImageIntoView(binding.messengerImageView, item.photoUrl!!)
        } else {
            binding.messengerImageView.setImageResource(R.drawable.ic_account_circle_black_36dp)
        }
    }
    ...
}

نحن بحاجة أيضا إلى عرض الرسائل التي هي الصور، لذلك أيضا تنفيذ bind() طريقة داخل الطبقة الداخلية ImageMessageViewHolder() :

FriendlyMessageAdapter.kt

inner class ImageMessageViewHolder(private val binding: ImageMessageBinding) :
    ViewHolder(binding.root) {
    fun bind(item: FriendlyMessage) {
        loadImageIntoView(binding.messageImageView, item.imageUrl!!)

        binding.messengerTextView.text = if (item.name == null) ANONYMOUS else item.name
        if (item.photoUrl != null) {
            loadImageIntoView(binding.messengerImageView, item.photoUrl!!)
        } else {
            binding.messengerImageView.setImageResource(R.drawable.ic_account_circle_black_36dp)
        }
    }
}

وأخيرا، مرة أخرى في MainActivity ، بدء ووقف الاستماع للحصول على التحديثات من قاعدة البيانات Firebase الحقيقي. تحديث onPause() و onResume() الأساليب في MainActivity كما هو مبين أدناه:

MainActivity.kt

public override fun onPause() {
    adapter.stopListening()
    super.onPause()
}

public override fun onResume() {
    super.onResume()
    adapter.startListening()
}

اختبر مزامنة الرسائل

  1. انقر فوق تشغيل (ينفذ ).
  2. في المحاكي جناح UI، والعودة إلى علامة التبويب قاعدة البيانات في الوقت الحقيقي، ثم يدويا إضافة رسالة جديدة. تأكد من ظهور الرسالة في تطبيق Android الخاص بك:

تهانينا ، لقد أضفت للتو قاعدة بيانات في الوقت الفعلي إلى تطبيقك!

تنفيذ إرسال الرسائل النصية

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

تحديث النقر المستمع على زر الإرسال في onCreate() الأسلوب في MainActivity الصف. هذا الرمز هو في الجزء السفلي من onCreate() طريقة بالفعل. تحديث onClick() الجسم لتتناسب مع التعليمات البرمجية أدناه:

MainActivity.kt

// Disable the send button when there's no text in the input field
// See MyButtonObserver for details
binding.messageEditText.addTextChangedListener(MyButtonObserver(binding.sendButton))

// When the send button is clicked, send a text message
binding.sendButton.setOnClickListener {
    val friendlyMessage = FriendlyMessage(
        binding.messageEditText.text.toString(),
        getUserName(),
        getPhotoUrl(),
        null /* no image */
    )
    db.reference.child(MESSAGES_CHILD).push().setValue(friendlyMessage)
    binding.messageEditText.setText("")
}

تنفيذ إرسال الرسائل المصورة

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

  • اختر صورة
  • التعامل مع تحديد الصورة
  • اكتب رسالة صورة مؤقتة إلى قاعدة بيانات Realtime
  • تبدأ في تحميل الصورة المحددة
  • قم بتحديث عنوان URL لرسالة الصورة إلى ذلك الخاص بالصورة التي تم تحميلها ، بمجرد اكتمال التحميل

اختر صورة

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

التعامل مع تحديد الصورة وكتابة رسالة مؤقتة

بمجرد اختيار المستخدم صورة، واختيار صورة Intent وأطلقت. وينفذ هذا بالفعل في التعليمات البرمجية في نهاية onCreate() الأسلوب. عند الانتهاء يقوم باستدعاء MainActivity الصورة onImageSelected() الأسلوب. باستخدام مقتطف الشفرة أدناه ، ستكتب رسالة مع عنوان url مؤقت للصورة إلى قاعدة البيانات تشير إلى أن الصورة قيد التحميل.

MainActivity.kt

private fun onImageSelected(uri: Uri) {
    Log.d(TAG, "Uri: $uri")
    val user = auth.currentUser
    val tempMessage = FriendlyMessage(null, getUserName(), getPhotoUrl(), LOADING_IMAGE_URL)
    db.reference
            .child(MESSAGES_CHILD)
            .push()
            .setValue(
                    tempMessage,
                    DatabaseReference.CompletionListener { databaseError, databaseReference ->
                        if (databaseError != null) {
                            Log.w(
                                    TAG, "Unable to write message to database.",
                                    databaseError.toException()
                            )
                            return@CompletionListener
                        }

                        // Build a StorageReference and then upload the file
                        val key = databaseReference.key
                        val storageReference = Firebase.storage
                                .getReference(user!!.uid)
                                .child(key!!)
                                .child(uri.lastPathSegment!!)
                        putImageInStorage(storageReference, uri, key)
                    })
}

تحميل الصورة ورسالة التحديث

أضف الأسلوب putImageInStorage() ل MainActivity . ويطلق عليه في onImageSelected() لبدء تحميل الصورة المحددة. بمجرد اكتمال التحميل ، ستقوم بتحديث الرسالة لاستخدام الصورة المناسبة.

MainActivity.kt

private fun putImageInStorage(storageReference: StorageReference, uri: Uri, key: String?) {
    // First upload the image to Cloud Storage
    storageReference.putFile(uri)
        .addOnSuccessListener(
            this
        ) { taskSnapshot -> // After the image loads, get a public downloadUrl for the image
            // and add it to the message.
            taskSnapshot.metadata!!.reference!!.downloadUrl
                .addOnSuccessListener { uri ->
                    val friendlyMessage =
                        FriendlyMessage(null, getUserName(), getPhotoUrl(), uri.toString())
                    db.reference
                        .child(MESSAGES_CHILD)
                        .child(key!!)
                        .setValue(friendlyMessage)
                }
        }
        .addOnFailureListener(this) { e ->
            Log.w(
                TAG,
                "Image upload task was unsuccessful.",
                e
            )
        }
}

اختبار إرسال الرسائل

  1. في Android Studio ، انقر فوقينفذ زر التشغيل.
  2. في Android Emulator ، أدخل رسالة ، ثم اضغط على زر الإرسال. يجب أن تكون الرسالة الجديدة مرئية في واجهة مستخدم التطبيق وفي واجهة مستخدم Firebase Emulator Suite.
  3. في Android Emulator ، انقر على صورة "+" لتحديد صورة من جهازك. يجب أن تكون الرسالة الجديدة مرئية أولاً مع صورة عنصر نائب ، ثم مع الصورة المحددة بمجرد اكتمال تحميل الصورة. يجب أن تكون الرسالة الجديدة مرئية أيضًا في واجهة مستخدم Emulator Suite ، على وجه التحديد ككائن في علامة تبويب قاعدة بيانات الوقت الفعلي وكمادة ثنائية في علامة تبويب التخزين.

لقد أنشأت للتو تطبيق دردشة في الوقت الفعلي باستخدام Firebase!

ما تعلمته

  • مصادقة Firebase
  • قاعدة بيانات Firebase Realtime
  • التخزين السحابي لـ Firebase

بعد ذلك ، حاول استخدام ما تعلمته في مختبر الرموز هذا لإضافة Firebase إلى تطبيق Android الخاص بك! لمعرفة المزيد عن Firebase، زيارة firebase.google.com .

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

ملاحظة: حتى بعد إعداد مشروع Firebase الحقيقي وخصوصا عند بدء بناء التطبيق الحقيقي، ننصحك باستخدام المحاكي جناح Firebase المحلية لتطوير واختبار.

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

أنشئ مشروع Firebase

  1. في المستعرض الخاص بك، انتقل إلى وحدة التحكم Firebase .
  2. حدد المشروع إضافة.
  3. حدد أو أدخل اسم المشروع. يمكنك استخدام أي اسم تريده.
  4. لست بحاجة إلى Google Analytics لمخطط الرموز هذا ، لذا يمكنك تخطي تمكينه لمشروعك.
  5. انقر فوق إنشاء مشروع. عندما مشروع جاهز، انقر فوق متابعة.

أضف Firebase إلى مشروع Android الخاص بك

قبل أن تبدأ هذه الخطوة ، احصل على تجزئة SHA1 لتطبيقك. قم بتشغيل الأمر التالي من المحلي build-android-start الدليل لتحديد SHA1 مفتاح التصحيح الخاص بك:

./gradlew signingReport

Store: /Users/<username>/.android/debug.keystore
Alias: AndroidDebugKey
MD5: A5:88:41:04:8F:06:59:6A:AE:33:76:87:AA:AD:19:23
SHA1: A7:89:F5:06:A8:07:A1:22:EC:90:6A:A6:EA:C3:D4:8B:3A:30:AB:18
SHA-256: 05:A2:2A:35:EE:F2:51:23:72:4D:72:67:A5:6A:8A:58:22:2C:00:A6:AB:F6:45:D5:A1:82:D8:90:A4:69:C8:FE
Valid until: Wednesday, August 10, 2044

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

ارجع إلى وحدة تحكم Firebase ، واتبع هذه الخطوات لتسجيل مشروع Android الخاص بك في مشروع Firebase:

  1. من شاشة النظرة العامة لمشروعك الجديد ، انقر فوق رمز Android لبدء سير عمل الإعداد: أضف تطبيق android
  2. على الشاشة التالية، أدخل com.google.firebase.codelab.friendlychat كاسم حزمة التطبيق الخاص بك.
  3. انقر فوق تسجيل التطبيقات، ثم انقر فوق تحميل جوجل-services.json إلى تحميل ملف التكوين Firebase الخاص بك.
  4. نسخ google-services.json الملف إلى app دليل مشروع Android.
  5. تخطى الخطوات المقبلة هو مبين في سير العمل إعداد وحدة التحكم (لقد تم القيام به بالفعل بالنسبة لك في build-android-start المشروع).
  6. تأكد من أن جميع التبعيات متاحة للتطبيق الخاص بك عن طريق مزامنة مشروعك مع ملفات Gradle. من شريط الأدوات الروبوت ستوديو، اختر ملف> مشروع تزامن مع الملفات Gradle.

هيئ مصادقة Firebase

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

  1. في وحدة التحكم Firebase ، حدد مصادقة من لوحة التنقل في الجانب الأيسر.
  2. حدد الدخول في علامة التبويب الأسلوب.
  3. انقر فوق بريد إلكتروني / كلمة المرور، ثم تبديل التحول إلى تمكين (الأزرق).
  4. انقر على Google، ثم تبديل التحول إلى تمكين (الأزرق) ووضع البريد الإلكتروني دعم المشروع.

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

تكوين قاعدة بيانات Realtime

يخزن التطبيق الموجود في مختبر الرموز هذا رسائل الدردشة في قاعدة بيانات Firebase Realtime. في هذا القسم ، سننشئ قاعدة بيانات ونضبط أمانها عبر لغة تكوين JSON تسمى قواعد أمان Firebase.

  1. في وحدة التحكم Firebase ، حدد قاعدة البيانات في الوقت الحقيقي من لوحة التنقل في الجانب الأيسر.
  2. إضغط على انشاء قاعدة بيانات لإنشاء مثيل جديد قاعدة البيانات في الوقت الحقيقي. عند المطالبة، حدد us-central1 المنطقة، ثم انقر فوق التالي.
  3. عند المطالبة حول قواعد الأمن، اختر وضع مقفل، ثم انقر فوق تمكين.
  4. مرة واحدة وقد تم إنشاء مثيل قاعدة البيانات، حدد علامة التبويب النظام، ثم تحديث التكوين قواعد بما يلي:
     {
       "rules": {
         "messages": {
           ".read": "auth.uid != null",
           ".write": "auth.uid != null"
         }
       }
     }
    

لمزيد من المعلومات حول كيفية قواعد الأمن العمل (بما في ذلك الوثائق على المتغير "المصادقة")، راجع وثائق أمن قاعدة البيانات في الوقت الحقيقي .

هيئ التخزين السحابي لـ Firebase

  1. في وحدة التحكم Firebase ، حدد التخزين من لوحة التنقل في الجانب الأيسر.
  2. انقر تبدأ لتمكين سحابة التخزين للمشروع الخاص بك.
  3. اتبع الخطوات في مربع الحوار لإعداد الحاوية الخاصة بك ، باستخدام الإعدادات الافتراضية المقترحة.

اتصل بموارد Firebase

في خطوة سابقة من هذا codelab، أضفت ما يلي إلى MainActivity.kt . ربطت هذه الكتلة الشرطية مشروع Android الخاص بك بمجموعة Firebase Emulator Suite.

// REMOVE OR DISABLE THIS
if (BuildConfig.DEBUG) {
    Firebase.database.useEmulator("10.0.2.2", 9000)
    Firebase.auth.useEmulator("10.0.2.2", 9099)
    Firebase.storage.useEmulator("10.0.2.2", 9199)
}

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