ফায়ারবেস অ্যান্ড্রয়েড কোডল্যাব - বন্ধুত্বপূর্ণ চ্যাট তৈরি করুন

স্ক্রিনশট

চিত্র: ওয়ার্কিং ফ্রেন্ডলি চ্যাট অ্যাপ্লিকেশন।

বন্ধুত্বপূর্ণ চ্যাট কোডল্যাবে আপনাকে স্বাগতম। এই কোডল্যাবে আপনি কীভাবে অ্যান্ড্রয়েডে একটি চ্যাট অ্যাপ তৈরি করতে ফায়ারবেস প্ল্যাটফর্মটি ব্যবহার করবেন তা শিখবেন।

আপনি কি শিখবেন

  • ব্যবহারকারীদের সাইন ইন করার জন্য ফায়ারবেস প্রমাণীকরণ কীভাবে ব্যবহার করবেন।
  • ফায়ারবেস রিয়েলটাইম ডেটাবেস ব্যবহার করে কীভাবে ডেটা সিঙ্ক করবেন।
  • ফায়ারবেসের জন্য ক্লাউড স্টোরেজে বাইনারি ফাইলগুলি কীভাবে সংরক্ষণ করবেন।
  • ফায়ারবেস দিয়ে অ্যান্ড্রয়েড অ্যাপ্লিকেশন বিকাশ করতে ফায়ারবেস লোকাল এমুলেটর স্যুট কীভাবে ব্যবহার করবেন।

আপনার যা দরকার

সংগ্রহস্থলটি ক্লোন করুন

কমান্ড লাইন থেকে গিটহাব সংগ্রহস্থলটি ক্লোন করুন:

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

অ্যান্ড্রয়েড স্টুডিওতে আমদানি করুন

অ্যান্ড্রয়েড স্টুডিওতে, ফাইল > খুলুন নির্বাচন করুন, তারপরে build-android-start ডিরেক্টরি নির্বাচন করুন ( android_studio_folder ) ডিরেক্টরিটি যেখানে আপনি নমুনা কোড ডাউনলোড করেছেন from

আপনার এখন অ্যান্ড্রয়েড স্টুডিওতে build-android-start প্রকল্পটি খোলা থাকা উচিত। আপনি যদি কোনও google-services.json ফাইল অনুপস্থিত সম্পর্কে কোনও সতর্কতা দেখতে পান তবে চিন্তা করবেন না। এটি পরবর্তী পদক্ষেপে যুক্ত করা হবে।

নির্ভরতা পরীক্ষা করুন

এই কোডল্যাবটিতে আপনার জন্য প্রয়োজনীয় সমস্ত নির্ভরতা ইতিমধ্যে আপনার জন্য যুক্ত করা হয়েছে তবে কীভাবে আপনার অ্যাপে ফায়ারবেস এসডিকে যুক্ত করবেন তা বোঝা গুরুত্বপূর্ণ:

build.gradle

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 .g

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'
}

ফায়ারবেস এমুলেটর স্যুটটি চালানোর জন্য আপনাকে ফায়ারবেস সিএলআই ইনস্টল করে ব্যবহার করতে হবে।

সিএলআই ইনস্টল করুন

বিকল্প 1 - এনপিএম সহ ইনস্টল করুন

আপনি যদি ইতিমধ্যে আপনার মেশিনে নোড.জেএস এবং এনপিএম ইনস্টল করে থাকেন তবে আপনি নিম্নলিখিত কমান্ডের সাহায্যে সিএলআই ইনস্টল করতে পারেন:

npm install -g firebase-tools@latest

বিকল্প 2 - স্বতন্ত্র বাইনারি ইনস্টল করুন

আপনার যদি নোড.জেএস / এনপিএম না থাকে বা আপনি অ্যাপ্লিকেশন বিকাশে নতুন হন, আপনি এখানে আপনার প্ল্যাটফর্মের নির্দেশাবলী অনুসরণ করে সিএলআইকে স্ট্যান্ডেলোন বাইনারি হিসাবে ইনস্টল করতে পারেন।

ইনস্টলেশন পরীক্ষা করুন

ফায়ারবেস সিএলআই ইনস্টল হয়ে গেলে আপনার 9.11.0 বা তার বেশি সংস্করণ রয়েছে কিনা তা নিশ্চিত করতে নিম্নলিখিত কমান্ডটি চালান:

firebase --version

অনুকরণকারী শুরু করুন

আপনার টার্মিনালে আপনার স্থানীয় codelab-friendlychat-android ডিরেক্টরিটির মূল থেকে নিম্নলিখিত কমান্ডটি চালান:

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

আপনার কিছু লগ দেখতে হবে। বন্দর মানগুলি firebase.json ফাইলে সংজ্ঞায়িত করা হয়েছিল, যা ক্লোন করা নমুনা 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.

ফায়ারবেস এমুলেটর স্যুট UI দেখতে আপনার ওয়েব ব্রাউজারে http: // লোকালহোস্ট: 4000 তে নেভিগেট করুন:

এমুলেটর স্যুইট ইউআই হোম

অনুকরণকারীকে ছেড়ে দিন emulators:start বাকি কোডল্যাবের জন্য কমান্ড চালানো emulators:start

আপনার অ্যাপ্লিকেশন সংযোগ করুন

অ্যান্ড্রয়েড স্টুডিওতে, 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)
}

গুগল-পরিষেবাদি.জসন যুক্ত করুন

আপনার অ্যান্ড্রয়েড অ্যাপ্লিকেশনটিকে ফায়ারবেসে সংযুক্ত করার জন্য, আপনাকে অবশ্যই আপনার অ্যান্ড্রয়েড প্রকল্পের app ফোল্ডারের ভিতরে একটি google-services.json ফাইল যুক্ত করতে হবে। এই কোডল্যাবের উদ্দেশ্যগুলির জন্য, আমরা একটি মক জেএসওএন ফাইল সরবরাহ করেছি যা আপনাকে ফায়ারবেস এমুলেটর স্যুটে সংযোগ করার অনুমতি দেবে।

mock-google-services.json ফাইলটি build-android-start/app ফোল্ডারে google-services.json হিসাবে অনুলিপি করুন:

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

এই কোডল্যাবের চূড়ান্ত পদক্ষেপে, আপনি কীভাবে একটি বাস্তব ফায়ারবেস প্রকল্প এবং ফায়ারবেস অ্যান্ড্রয়েড অ্যাপ তৈরি করবেন তা শিখবেন যাতে আপনি এই মক জেএসওএন ফাইলটিকে নিজের কনফিগারেশনের মাধ্যমে প্রতিস্থাপন করতে পারেন।

অ্যাপটি চালান Run

এখন আপনি এই প্রকল্পটি অ্যান্ড্রয়েড স্টুডিওতে আমদানি করেছেন এবং একটি ফায়ারবেস কনফিগারেশন জেএসওএন ফাইল যুক্ত করেছেন, আপনি প্রথমবার অ্যাপটি চালানোর জন্য প্রস্তুত ready

  1. আপনার অ্যান্ড্রয়েড এমুলেটর শুরু করুন।
  2. অ্যান্ড্রয়েড স্টুডিওতে, রান ক্লিক করুন ( এক্সিকিউট ) সরঞ্জামদণ্ডে।

অ্যাপ্লিকেশনটি আপনার অ্যান্ড্রয়েড এমুলেটরটিতে চালু করা উচিত। এই মুহুর্তে, আপনার একটি খালি বার্তা তালিকা দেখতে হবে, এবং বার্তা প্রেরণ এবং গ্রহণের কাজ করবে না। এই কোডল্যাবের পরবর্তী ধাপে আপনি ব্যবহারকারীদের প্রমাণীকরণ করবেন যাতে তারা বন্ধুত্বপূর্ণ চ্যাট ব্যবহার করতে পারে।

এই অ্যাপ্লিকেশনটি সমস্ত চ্যাট বার্তাগুলি সঞ্চয় করতে ফায়ারবেস রিয়েলটাইম ডেটাবেস ব্যবহার করবে। যদিও আমরা ডেটা যুক্ত করার আগে, আমাদের অবশ্যই নিশ্চিত করা উচিত যে অ্যাপটি সুরক্ষিত রয়েছে এবং কেবলমাত্র প্রমাণীকৃত ব্যবহারকারীরা বার্তা পোস্ট করতে পারেন। এই পদক্ষেপে, আমরা ফায়ারবেস প্রমাণীকরণ সক্ষম করব এবং রিয়েলটাইম ডেটাবেস সুরক্ষা বিধিগুলি কনফিগার করব।

বেসিক সাইন-ইন কার্যকারিতা যুক্ত করুন

এরপরে আমরা ব্যবহারকারীদের সনাক্ত করতে এবং একটি সাইন-ইন স্ক্রিন প্রয়োগ করতে অ্যাপ্লিকেশনটিতে কিছু বেসিক ফায়ারবেস প্রমাণীকরণ কোড যুক্ত করব।

বর্তমান ব্যবহারকারীর জন্য পরীক্ষা করুন

প্রথমে MainActivity.kt শ্রেণিতে নিম্নলিখিত উদাহরণটি পরিবর্তনশীল যুক্ত করুন:

মেইনএকটিভিটি.কিটি

// Firebase instance variables
private lateinit var auth: FirebaseAuth

এখন আসুন যখনই তারা অ্যাপটি খোলেন এবং অননুমোদিত হয়ে থাকে তখন ব্যবহারকারীকে সাইন-ইন স্ক্রিনে প্রেরণে MainActivity পরিবর্তন করুন। binding দৃশ্যের সাথে সংযুক্ত হওয়ার পরে নিম্নলিখিতটি onCreate() পদ্ধতিতে যুক্ত করুন:

মেইনএকটিভিটি.কিটি

// 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() সময় ব্যবহারকারী সাইন ইন করেছেন কিনা তাও আমরা দেখতে চাই:

মেইনএকটিভিটি.কিটি

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() ব্যবহারকারী সম্পর্কে যথাযথ তথ্য ফিরিয়ে getUserName() জন্য getUserPhotoUrl() এবং getUserName() পদ্ধতিগুলি প্রয়োগ করুন:

মেইনএকটিভিটি.কিটি

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() পদ্ধতিটি প্রয়োগ করুন:

মেইনএকটিভিটি.কিটি

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

প্রয়োজনে সাইন-ইন স্ক্রিনে ব্যবহারকারীকে প্রেরণ করার জন্য এখন আমাদের সমস্ত যুক্তিযুক্ত স্থানে রয়েছে। এরপরে ব্যবহারকারীদের যথাযথভাবে প্রমাণ করার জন্য আমাদের সাইন-ইন স্ক্রিন প্রয়োগ করতে হবে।

সাইন-ইন স্ক্রিনটি কার্যকর করুন

SignInActivity.kt ফাইলটি খুলুন। প্রমাণীকরণ শুরু করতে এখানে একটি সাধারণ সাইন-ইন বোতাম ব্যবহৃত হয়। এই বিভাগে, আপনি সাইন ইন করার জন্য যুক্তি প্রয়োগ করতে ফায়ারবেসআইআই ব্যবহার করবেন।

// Firebase instance variables SignInActivity // Firebase instance variables মন্তব্যটির আওতায় সাইন SignInActivity ক্লাসে একটি SignInActivity // Firebase instance variables করুন:

SignInActivity.kt

// Firebase instance variables
private lateinit var auth: FirebaseAuth

তারপর, সম্পাদনা onCreate() পদ্ধতি একই ভাবে আপনি করেছিল মধ্যে Firebase আরম্ভ করতে MainActivity :

SignInActivity.kt

// Initialize FirebaseAuth
auth = Firebase.auth

সাইন SignInActivity একটি ActivityResultLauncher SignInActivity ক্ষেত্র যুক্ত করুন:

SignInActivity.kt

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

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

এরপরে, ফায়ারবেসইউআই সাইন ইন প্রবাহটি বন্ধ করতে অন onStart() পদ্ধতিটি সম্পাদনা করুন:

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)
        }
    }
}

এটাই! আপনি ফায়ারবেসআইআইয়ের সাথে অল্প কয়েকটি পদ্ধতি কল এবং কোনও সার্ভার-সাইড কনফিগারেশন পরিচালনা করার প্রয়োজন ছাড়াই প্রমাণীকরণ প্রয়োগ করেছেন।

আপনার কাজ পরীক্ষা করুন

আপনার অ্যান্ড্রয়েড এমুলেটরটিতে অ্যাপ্লিকেশন চালান। আপনাকে অবিলম্বে সাইন ইন স্ক্রিনে প্রেরণ করা উচিত। ইমেল বোতাম দিয়ে সাইন ইন আলতো চাপুন, তারপরে একটি অ্যাকাউন্ট তৈরি করুন। যদি সবকিছু সঠিকভাবে প্রয়োগ করা হয় তবে আপনাকে মেসেজিং স্ক্রিনে প্রেরণ করা উচিত।

সাইন ইন করার পরে, আপনার ব্রাউজারে ফায়ারবেস এমুলেটর স্যুইট ইউআই খুলুন, তারপরে এই প্রথম সাইন ইন হওয়া ব্যবহারকারীর অ্যাকাউন্টটি দেখতে প্রমাণীকরণ ট্যাবে ক্লিক করুন।

এই পদক্ষেপে, আমরা রিয়েলটাইম ডেটাবেসে সংরক্ষিত বার্তাগুলি পড়তে ও প্রদর্শন করতে কার্যকারিতা যুক্ত করব।

নমুনা বার্তা আমদানি করুন

  1. ফায়ারবেস এমুলেটর স্যুট ইউআইতে, রিয়েলটাইম ডেটাবেস ট্যাবটি নির্বাচন করুন।
  2. আপনার কোডলব সংগ্রহস্থলের স্থানীয় কপি থেকে ডেটা ভিউয়ারে প্রাথমিক_ initial_messages.json ফাইলটি টানুন এবং ফেলে দিন।

আপনার এখন ডাটাবেসের messages নোডের নীচে কয়েকটি বার্তা থাকা উচিত।

তথ্য পড়ুন

বার্তা সিঙ্ক্রোনাইজ করুন

এই বিভাগে আমরা এমন কোড যুক্ত করব যা অ্যাপ্লিকেশন UI তে সদ্য সংযুক্ত বার্তাগুলি সিঙ্ক্রোনাইজ করে:

  • ফায়ারবেস রিয়েলটাইম ডেটাবেস আরম্ভ করা এবং ডেটাতে করা পরিবর্তনগুলি পরিচালনা করতে শ্রোতা যুক্ত করা।
  • RecyclerView অ্যাডাপ্টার আপডেট করা হচ্ছে যাতে নতুন বার্তা প্রদর্শিত হবে।
  • MainActivity ক্লাসে আপনার অন্যান্য ফায়ারবেস ইনস্ট্যান্স ভেরিয়েবলগুলির সাথে ডেটাবেস ইনস্ট্যান্স ভেরিয়েবল যুক্ত করা:

মেইনএকটিভিটি.কিটি

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

মন্তব্যের আওতায় আপনার onCreate() পদ্ধতিটি সংশোধন করুন // Initialize Realtime Database and FirebaseRecyclerAdapter নীচে সংজ্ঞায়িত কোডের মাধ্যমে // Initialize Realtime Database and FirebaseRecyclerAdapter করুন। এই কোডটি রিয়েলটাইম ডেটাবেস থেকে সমস্ত বিদ্যমান বার্তাগুলি যুক্ত করে এবং তারপরে আপনার ফায়ারবেস রিয়েলটাইম ডেটাবেসগুলিতে messages পথের নীচে নতুন শিশুদের এন্ট্রি শোনায়। এটি প্রতিটি বার্তার জন্য ইউআইতে একটি নতুন উপাদান যুক্ত করে:

মেইনএকটিভিটি.কিটি

// 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 ক্লাসে পরবর্তী অভ্যন্তর শ্রেণীর MessageViewHolder() মধ্যে bind() পদ্ধতি প্রয়োগ করুন:

ফ্রেন্ডলিমেজেজএডাপ্টার.কেটি

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)
        }
    }
    ...
}

আমাদের এমন বার্তাগুলিও প্রদর্শন করা দরকার যা চিত্রগুলি রয়েছে, তাই অভ্যন্তরীণ শ্রেণির ImageMessageViewHolder() মধ্যে bind() পদ্ধতিটিও প্রয়োগ করে:

ফ্রেন্ডলিমেজেজএডাপ্টার.কেটি

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 , MainActivity ফিরে ফায়ারবেস রিয়েলটাইম ডেটাবেস থেকে আপডেটগুলি শুনতে এবং শুরু করা বন্ধ করুন। আপডেট করুন onPause() এবং onResume() পদ্ধতি MainActivity নিচের চিত্রের:

মেইনএকটিভিটি.কিটি

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

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

বার্তাগুলি সিঙ্ক করার চেষ্টা করুন

  1. রান ক্লিক করুন ( এক্সিকিউট )।
  2. এমুলেটর স্যুইট ইউআইতে রিয়েলটাইম ডাটাবেস ট্যাবে ফিরে আসুন , তারপরে ম্যানুয়ালি একটি নতুন বার্তা যুক্ত করুন। নিশ্চিত করুন যে বার্তাটি আপনার অ্যান্ড্রয়েড অ্যাপে প্রদর্শিত হচ্ছে:

অভিনন্দন, আপনি কেবল আপনার অ্যাপ্লিকেশনটিতে একটি রিয়েলটাইম ডাটাবেস যুক্ত করেছেন!

পাঠ্য বার্তা প্রেরণ কার্যকর করুন

এই বিভাগে, আপনি অ্যাপ ব্যবহারকারীদের পাঠ্য বার্তা প্রেরণের ক্ষমতা যুক্ত করবেন। নীচের কোড স্নিপেট প্রেরণ বোতামে ক্লিক ইভেন্টগুলির জন্য শোনায়, বার্তা ক্ষেত্রের বিষয়বস্তু সহ একটি নতুন FriendlyMessage অবজেক্ট তৈরি করে এবং ডেটাবেজে বার্তাটি পুশ করে। push() পদ্ধতিটি push() অবজেক্টের পথে একটি স্বয়ংক্রিয়ভাবে উত্পন্ন আইডি যুক্ত করে। এই আইডিগুলি অনুক্রমিক যা নিশ্চিত করে যে নতুন বার্তাগুলি তালিকার শেষের দিকে যুক্ত হবে।

আপডেটে সেন্ড বাটন ক্লিক শ্রোতা onCreate() পদ্ধতি MainActivity বর্গ। এই কোডটি ইতিমধ্যে onCreate() পদ্ধতির নীচে রয়েছে। নীচের কোডটি মেলে onClick() বডি আপডেট করুন:

মেইনএকটিভিটি.কিটি

// 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("")
}

চিত্র বার্তা প্রেরণ কার্যকর করুন

এই বিভাগে, আপনি অ্যাপ ব্যবহারকারীদের জন্য চিত্র বার্তা প্রেরণের ক্ষমতা যুক্ত করবেন। এই পদক্ষেপের সাহায্যে একটি চিত্র বার্তা তৈরি করা হয়:

  • চিত্র নির্বাচন করুন
  • চিত্র নির্বাচন পরিচালনা করুন
  • রিয়েলটাইম ডেটাবেসে অস্থায়ী চিত্র বার্তা লিখুন
  • নির্বাচিত চিত্র আপলোড করা শুরু করুন
  • আপলোড হওয়া চিত্রটির সাথে চিত্র বার্তার URL আপডেট করুন, একবার আপলোড সম্পূর্ণ হয়ে যায়

চিত্র নির্বাচন করুন

ছবি যুক্ত করতে এই কোডল্যাব ফায়ারবেসের জন্য ক্লাউড স্টোরেজ ব্যবহার করে। আপনার অ্যাপ্লিকেশনটির বাইনারি ডেটা সঞ্চয় করার জন্য ক্লাউড স্টোরেজ একটি ভাল জায়গা।

চিত্র নির্বাচন পরিচালনা এবং অস্থায়ী বার্তা লিখুন

ব্যবহারকারী একবার কোনও ছবি নির্বাচন করলে চিত্র নির্বাচন Intent চালু হয় is এটি ইতিমধ্যে onCreate() পদ্ধতির শেষে কোডে প্রয়োগ করা হয়েছে। কর্ম সমাপ্ত হলে এটা আহ্বান MainActivity এর onImageSelected() পদ্ধতি। নীচের কোড স্নিপেট ব্যবহার করে, আপনি ডেটাবেজে অস্থায়ী চিত্র url সহ একটি বার্তা লিখবেন যা ইমেজ আপলোড হচ্ছে তা নির্দেশ করে।

মেইনএকটিভিটি.কিটি

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() জন্য এটি onImageSelected() এ ডাকা হয়। আপলোডটি সম্পূর্ণ হয়ে গেলে আপনি উপযুক্ত চিত্রটি ব্যবহার করতে বার্তাটি আপডেট করবেন।

মেইনএকটিভিটি.কিটি

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. অ্যান্ড্রয়েড স্টুডিওতে, ক্লিক করুন এক্সিকিউট রান বোতাম।
  2. আপনার অ্যান্ড্রয়েড এমুলেটরটিতে একটি বার্তা প্রবেশ করুন, তারপরে প্রেরণ বোতামটি আলতো চাপুন। নতুন বার্তাটি অ্যাপ্লিকেশন UI এবং ফায়ারবেস এমুলেটর স্যুট UI তে দৃশ্যমান হওয়া উচিত।
  3. অ্যান্ড্রয়েড এমুলেটরে, আপনার ডিভাইস থেকে একটি চিত্র নির্বাচন করতে "+" চিত্রটি আলতো চাপুন। নতুন বার্তাটি প্রথমে কোনও স্থানধারক চিত্রের সাথে দৃশ্যমান হওয়া উচিত এবং তারপরে চিত্র আপলোড সম্পূর্ণ হওয়ার পরে নির্বাচিত চিত্রের সাথে। নতুন বার্তাটি এমুলেটর স্যুইট ইউআইতেও দৃশ্যমান হওয়া উচিত, বিশেষত রিয়েলটাইম ডেটাবেস ট্যাবে কোনও বস্তু এবং স্টোরেজ ট্যাবে ব্লব হিসাবে।

আপনি সবেমাত্র ফায়ারবেস ব্যবহার করে একটি রিয়েল-টাইম চ্যাট অ্যাপ্লিকেশন তৈরি করেছেন!

আপনি যা শিখেছেন

  • ফায়ারবেস প্রমাণীকরণ
  • ফায়ারবেস রিয়েলটাইম ডেটাবেস
  • ফায়ারবাসের জন্য ক্লাউড স্টোরেজ

এরপরে, আপনার নিজের অ্যান্ড্রয়েড অ্যাপে ফায়ারবেস যুক্ত করতে আপনি এই কোডল্যাবে যা শিখেছেন তা ব্যবহার করে দেখুন! ফায়ারবেস সম্পর্কে আরও জানার জন্য, ফায়ারবেস . google.com দেখুন

যদি আপনি কীভাবে একটি বাস্তব ফায়ারবেস প্রকল্প স্থাপন করতে চান এবং প্রকৃত ফায়ারবেস সংস্থানগুলি (একটি ডেমো প্রকল্পের পরিবর্তে এবং কেবল অনুকরণীয় সংস্থানগুলির পরিবর্তে) ব্যবহার করতে চান তবে পরবর্তী পদক্ষেপ অবিরত করুন।

দ্রষ্টব্য: আপনি একটি বাস্তব ফায়ারবেস প্রকল্প স্থাপন করার পরেও এবং বিশেষত যখন আপনি একটি সত্যিকারের অ্যাপ্লিকেশন তৈরি করা শুরু করেন, আমরা ফায়ারবেস লোকাল এমুলেটর স্যুটটি বিকাশ এবং পরীক্ষার জন্য ব্যবহার করার পরামর্শ দিই।

এই পদক্ষেপে, আপনি এই কোডল্যাবটি ব্যবহারের জন্য একটি আসল ফায়ারবেস প্রকল্প এবং একটি ফায়ারবেস অ্যান্ড্রয়েড অ্যাপ তৈরি করবেন। আপনি আপনার অ্যাপ্লিকেশনটিতে আপনার অ্যাপ-নির্দিষ্ট ফায়ারবেস কনফিগারেশন যুক্ত করবেন। এবং অবশেষে, আপনি আপনার অ্যাপ্লিকেশনটির সাথে ব্যবহারের জন্য প্রকৃত ফায়ারবেস সংস্থানগুলি সেট আপ করবেন।

ফায়ারবেস প্রকল্প তৈরি করুন

  1. আপনার ব্রাউজারে, ফায়ারবেস কনসোলে যান
  2. প্রকল্প যুক্ত করুন নির্বাচন করুন
  3. কোনও প্রকল্পের নাম নির্বাচন বা প্রবেশ করান। আপনি যে কোনও নাম ব্যবহার করতে পারেন।
  4. এই কোডল্যাবের জন্য আপনার গুগল অ্যানালিটিকসের প্রয়োজন নেই, তাই আপনি আপনার প্রকল্পের জন্য এটি সক্ষম করে এড়িয়ে যেতে পারেন।
  5. প্রকল্প তৈরি করুন ক্লিক করুন । আপনার প্রকল্পটি প্রস্তুত হয়ে গেলে চালিয়ে যান ক্লিক করুন।

আপনার অ্যান্ড্রয়েড প্রকল্পে ফায়ারবেস যুক্ত করুন

আপনি এই পদক্ষেপটি শুরু করার আগে আপনার অ্যাপ্লিকেশনটির SHA1 হ্যাশ পান। আপনার ডিবাগ কীটির SHA1 নির্ধারণ করতে আপনার স্থানীয় build-android-start ডিরেক্টরি থেকে নিম্নলিখিত কমান্ডটি চালান:

./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 হ্যাশটি খুঁজে পেতে অক্ষম হন তবে আরও তথ্যের জন্য এই পৃষ্ঠাটি দেখুন।

ফায়ারবেস কনসোলে ফিরে যান এবং আপনার ফায়ারবেস প্রকল্পের সাথে আপনার অ্যান্ড্রয়েড প্রকল্পটি নিবন্ধিত করতে এই পদক্ষেপগুলি অনুসরণ করুন:

  1. আপনার নতুন প্রকল্পের ওভারভিউ স্ক্রীন থেকে, সেটআপ ওয়ার্কফ্লো চালু করতে অ্যান্ড্রয়েড আইকনটিতে ক্লিক করুন: অ্যান্ড্রয়েড অ্যাপ যুক্ত করুন add
  2. পরের স্ক্রিনে, আপনার অ্যাপ্লিকেশনটির প্যাকেজের নাম হিসাবে com.google.firebase.codelab.friendlychat লিখুন।
  3. রেজিস্টার অ্যাপ্লিকেশন ক্লিক করুন , তারপরে আপনার ফায়ারবেস কনফিগারেশন ফাইলটি ডাউনলোড করতে google-Services.json ডাউনলোড করুন ক্লিক করুন
  4. আপনার অ্যান্ড্রয়েড প্রকল্পের app ডিরেক্টরিতে google-services.json ফাইলটি অনুলিপি করুন।
  5. কনসোলের সেটআপ ওয়ার্কফ্লোতে প্রদর্শিত পরবর্তী পদক্ষেপগুলি এড়িয়ে যান (সেগুলি ইতিমধ্যে build-android-start প্রজেক্টে আপনার জন্য করা হয়ে গেছে)।
  6. আপনার প্রকল্পটি গ্রেডল ফাইলগুলির সাথে সিঙ্ক করে আপনার অ্যাপ্লিকেশনে সমস্ত নির্ভরতা উপলব্ধ রয়েছে তা নিশ্চিত করুন। অ্যান্ড্রয়েড স্টুডিও টুলবার থেকে, গ্রেড ফাইলগুলির সাথে ফাইল > সিঙ্ক প্রকল্প নির্বাচন করুন

ফায়ারবেস প্রমাণীকরণ কনফিগার করুন

আপনার অ্যাপ্লিকেশনটি আপনার ব্যবহারকারীর পক্ষে ফায়ারবেস প্রমাণীকরণ API গুলি অ্যাক্সেস করার আগে আপনাকে ফায়ারবেস প্রমাণীকরণ এবং সাইন ইন সরবরাহকারী আপনার অ্যাপ্লিকেশনটিতে ব্যবহার করতে চান তা সক্ষম করতে হবে।

  1. ফায়ারবেস কনসোলে , বাম-দিকের নেভিগেশন প্যানেল থেকে প্রমাণীকরণ নির্বাচন করুন।
  2. সাইন-ইন পদ্ধতি ট্যাবটি নির্বাচন করুন
  3. ইমেল / পাসওয়ার্ড ক্লিক করুন , তারপরে সক্রিয় (নীল) এ স্যুইচটি টগল করুন।
  4. গুগল ক্লিক করুন , তারপরে সক্রিয় (নীল) এ স্যুইচটি টগল করুন এবং একটি প্রকল্প সমর্থন ইমেল সেট করুন।

"CONFIGURATION_NOT_FOUND" বার্তাটি দিয়ে যদি আপনি এই কোডলবটিতে পরে ত্রুটি পান তবে এই পদক্ষেপে ফিরে আসুন এবং আপনার কাজটি ডাবল পরীক্ষা করে দেখুন।

রিয়েলটাইম ডেটাবেস কনফিগার করুন

এই কোডল্যাবের অ্যাপ্লিকেশন ফায়ারবেস রিয়েলটাইম ডেটাবেসে চ্যাট বার্তাগুলি সঞ্চয় করে। এই বিভাগে, আমরা একটি ডাটাবেস তৈরি করব এবং ফায়ারবেস সুরক্ষা বিধিমালা নামে একটি JSON কনফিগারেশন ভাষার মাধ্যমে এর সুরক্ষাটি কনফিগার করব।

  1. ফায়ারবেস কনসোলে , বাম দিকের নেভিগেশন প্যানেল থেকে রিয়েলটাইম ডেটাবেস নির্বাচন করুন।
  2. একটি নতুন রিয়েলটাইম ডাটাবেস উদাহরণ তৈরি করতে ডেটাবেস তৈরি করুন ক্লিক করুন । অনুরোধ জানানো হলে, us-central1 অঞ্চল নির্বাচন করুন, তারপরে Next ক্লিক করুন।
  3. সুরক্ষা বিধি সম্পর্কে জিজ্ঞাসা করা হলে, লক করা মোডটি চয়ন করুন , তারপরে সক্ষম ক্লিক করুন।
  4. ডাটাবেস উদাহরণটি তৈরি হয়ে গেলে, বিধিগুলি ট্যাবটি নির্বাচন করুন, তারপরে নিম্নলিখিতগুলির সাথে বিধিগুলি কনফিগারেশন আপডেট করুন:
     {
       "rules": {
         "messages": {
           ".read": "auth.uid != null",
           ".write": "auth.uid != null"
         }
       }
     }
    

সুরক্ষা বিধিগুলি কীভাবে কাজ করে ("লেখক" ভেরিয়েবলের ডকুমেন্টেশন সহ) আরও তথ্যের জন্য, রিয়েলটাইম ডেটাবেস সুরক্ষা ডকুমেন্টেশন দেখুন

ফায়ারবাসের জন্য ক্লাউড স্টোরেজ কনফিগার করুন

  1. ফায়ারবেস কনসোলে , বাম-পাশের নেভিগেশন প্যানেল থেকে সঞ্চয়স্থান নির্বাচন করুন।
  2. আপনার প্রকল্পের জন্য ক্লাউড স্টোরেজ সক্ষম করতে শুরু করুন ক্লিক করুন
  3. প্রস্তাবিত ডিফল্ট ব্যবহার করে আপনার বালতি সেট আপ করতে ডায়লগের পদক্ষেপগুলি অনুসরণ করুন।

ফায়ারবেস সংস্থানগুলিতে সংযুক্ত হন

এই কোডল্যাবের পূর্ববর্তী পদক্ষেপে আপনি নিম্নলিখিতটি MainActivity.kt । এই শর্তসাপূর্ণ ব্লকটি আপনার অ্যান্ড্রয়েড প্রকল্পটিকে ফায়ারবেস এমুলেটর স্যুটে সংযুক্ত করেছে।

// 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)
}

আপনি যদি নতুন অ্যাপ্লিকেশনটিকে আপনার নতুন প্রকৃত ফায়ারবেস প্রকল্প এবং এর আসল ফায়ারবেস সংস্থার সাথে সংযুক্ত করতে চান তবে আপনি এই ব্লকটি সরিয়ে ফেলতে পারেন বা আপনার অ্যাপ্লিকেশনটি রিলিজ মোডে চালাতে পারেন যাতে BuildConfig.DEBUG false is