Ta strona została przetłumaczona przez Cloud Translation API.

Ćwiczenie z programowania w Firebase na Androida – czat z łatwością tworzenia

1. Omówienie

Zrzut ekranu

Obraz: Przyjazna dla pracowników aplikacja do obsługi czatu.

Witamy na szkoleniu z programowania na temat przyjaznego czatu. Z tego ćwiczenia w Codelabs dowiesz się, jak za pomocą platformy Firebase utworzyć aplikację do obsługi czatu na Androida.

Czego się nauczysz

Jak umożliwić użytkownikom logowanie się za pomocą uwierzytelniania Firebase.
Jak synchronizować dane przy użyciu Bazy danych czasu rzeczywistego Firebase.
Jak przechowywać pliki binarne w Cloud Storage dla Firebase.
Jak używać Pakietu emulatorów lokalnych Firebase do tworzenia aplikacji na Androida przy użyciu Firebase.

Czego potrzebujesz

Najnowsza wersja Android Studio.
Emulator Androida z Androidem 5.0 lub nowszym.
Node.js w wersji 10 lub nowszej (aby korzystać z Pakietu emulatorów).
Java 8 lub nowsza. Aby zainstalować Javę, postępuj zgodnie z tymi instrukcjami. aby sprawdzić wersję, uruchom java -version.
Znajomość języka programowania Kotlin.

2. Pobieranie przykładowego kodu

Klonowanie repozytorium

Sklonuj repozytorium GitHub, używając wiersza poleceń:

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

Importuj do Android Studio

W Android Studio wybierz Plik > Otwórz, a następnie wybierz katalog build-android-start ( android_studio_folder ) z katalogu, z którego pobrano przykładowy kod.

Projekt build-android-start powinien być teraz otwarty w Android Studio. Jeśli zobaczysz ostrzeżenie o braku pliku google-services.json, nie przejmuj się. Zostanie ona dodana w późniejszym kroku.

Sprawdź zależności

W ramach tego ćwiczenia w Codelabs wszystkie niezbędne zależności zostały już dodane, ale trzeba dowiedzieć się, jak dodać pakiet SDK Firebase do aplikacji:

build.gradle.kts

plugins {
    id("com.android.application") version "8.0.0" apply false
    id("com.android.library") version "8.0.0" apply false
    id("org.jetbrains.kotlin.android") version "1.8.20" apply false

    // The google-services plugin is required to parse the google-services.json file
    id("com.google.gms.google-services") version "4.3.15" apply false
}

app/build.gradle.kts

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:20.5.0")

    // Firebase SDK
    implementation(platform("com.google.firebase:firebase-bom:32.0.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:8.0.2")
    implementation("com.firebaseui:firebase-ui-database:8.0.2")
}

3. Instalowanie interfejsu wiersza poleceń Firebase

W ramach tego ćwiczenia w programie użyjesz Pakietu emulatorów Firebase do lokalnej emulacji Uwierzytelnianie Firebase, Bazy danych czasu rzeczywistego i Cloud Storage. Zapewnia to bezpieczne, szybkie i bezpłatne lokalne środowisko programistyczne do tworzenia aplikacji.

Instalowanie interfejsu wiersza poleceń Firebase

Najpierw musisz zainstalować interfejs wiersza poleceń Firebase. Jeśli używasz systemu macOS lub Linux, możesz uruchomić następujące polecenie cURL:

curl -sL https://firebase.tools | bash

Jeśli używasz systemu Windows, przeczytaj instrukcje instalacji, by pobrać samodzielny plik binarny lub zainstalować go za pomocą npm.

Po zainstalowaniu interfejsu wiersza poleceń uruchomienie interfejsu firebase --version powinno zgłosić wersję 9.0.0 lub nowszą:

$ firebase --version
9.0.0

Zaloguj się

Uruchom firebase login, aby połączyć interfejs wiersza poleceń z kontem Google. Otworzy się nowe okno przeglądarki, w którym będzie można dokończyć proces logowania. Pamiętaj, aby wybrać to samo konto co podczas tworzenia projektu Firebase.

4. Połącz się z Pakietem emulatorów Firebase

Uruchom emulatory

W terminalu uruchom to polecenie w katalogu głównym lokalnego katalogu codelab-friendlychat-android:

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

Powinny wyświetlić się takie logi. Wartości portów zostały określone w pliku firebase.json, który został uwzględniony w sklonowanym przykładowym kodzie.

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

Aby wyświetlić interfejs pakietu emulatorów Firebase, otwórz w przeglądarce stronę http://localhost:4000:

Strona główna interfejsu pakietu emulatorów

Do końca ćwiczeń z programowania pozostaw uruchomione polecenie emulators:start.

Połącz aplikację

W Android Studio otwórz MainActivity.kt, a następnie dodaj ten kod w metodzie 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)
}

5. Uruchom aplikację startową

Dodaj google-services.json

Aby Twoja aplikacja na Androida mogła połączyć się z Firebase, musisz dodać plik google-services.json w folderze app projektu na Androida. Na potrzeby tego ćwiczenia w Codelabs udostępniamy próbny plik JSON, który pozwoli Ci połączyć się z Pakietem emulatorów Firebase.

Skopiuj plik mock-google-services.json do folderu build-android-start/app jako google-services.json:

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

W ostatnim kroku tego ćwiczenia w Codelabs dowiesz się, jak utworzyć prawdziwy projekt Firebase i aplikację Firebase na Androida, aby móc zastąpić ten przykładowy plik JSON własną konfiguracją.

Uruchom aplikację

Po zaimportowaniu projektu do Android Studio i dodaniu pliku JSON konfiguracji Firebase możesz uruchomić aplikację po raz pierwszy.

Uruchom emulator Androida.
W Android Studio kliknij Uruchom ( ) na pasku narzędzi.

Aplikacja powinna się uruchomić przy użyciu emulatora Androida. W tym momencie lista wiadomości powinna być pusta, a wysyłanie i odbieranie wiadomości nie będzie działać. W następnym kroku tego ćwiczenia z programowania uwierzytelnisz użytkowników, aby mogli korzystać z przyjaznego czatu.

6. Włącz uwierzytelnianie

Ta aplikacja będzie korzystać z Bazy danych czasu rzeczywistego Firebase do przechowywania wszystkich wiadomości czatu. Zanim jednak dodamy dane, musimy się upewnić, że aplikacja jest bezpieczna i że tylko uwierzytelnieni użytkownicy mogą publikować wiadomości. W tym kroku włączymy Uwierzytelnianie Firebase i skonfigurujemy reguły zabezpieczeń Bazy danych czasu rzeczywistego.

Następnie dodamy do aplikacji podstawowy kod uwierzytelniania Firebase, aby wykrywać użytkowników i wdrażać ekran logowania.

Sprawdź bieżącego użytkownika

Najpierw dodaj tę zmienną instancji do klasy MainActivity.kt:

MainActivity.kt

// Firebase instance variables
private lateinit var auth: FirebaseAuth

Teraz zmodyfikujmy MainActivity, aby kierować użytkownika na ekran logowania, gdy otwiera aplikację bez uwierzytelnienia. Dodaj następujący kod do metody onCreate() po dołączeniu do widoku danych 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
}

Chcemy też sprawdzić, czy użytkownik był zalogowany w 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
    }
}

Następnie zaimplementuj metody getUserPhotoUrl() i getUserName(), aby zwracać odpowiednie informacje o obecnie uwierzytelnionego użytkownika 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
}

Następnie zaimplementuj metodę signOut() do obsługi przycisku wylogowania:

MainActivity.kt

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

Teraz mamy wszystkie mechanizmy, które w razie potrzeby odsyłają użytkownika do ekranu logowania. Następnie musimy zaimplementować ekran logowania, aby prawidłowo uwierzytelnić użytkowników.

Otwórz plik SignInActivity.kt. W tym przypadku do inicjowania uwierzytelniania służy prosty przycisk logowania. W tej sekcji wdrożysz logikę logowania za pomocą FirebaseUI.

Dodaj zmienną instancji uwierzytelniania w klasie SignInActivity w komentarzu // Firebase instance variables:

SignInActivity.kt

// Firebase instance variables
private lateinit var auth: FirebaseAuth

Następnie zmodyfikuj metodę onCreate(), aby zainicjować Firebase w taki sam sposób jak w MainActivity:

SignInActivity.kt

// Initialize FirebaseAuth
auth = Firebase.auth

Dodaj pole ActivityResultLauncher do pola SignInActivity:

SignInActivity.kt

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

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

Następnie edytuj metodę onStart(), aby rozpocząć proces logowania się w 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()
    }
}

Następnie zaimplementuj metodę onSignInResult do obsługi wyniku logowania. Jeśli logowanie przebiegło pomyślnie, przejdź do 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)
        }
    }
}

To wszystko. Udało Ci się wdrożyć uwierzytelnianie za pomocą FirebaseUI za pomocą zaledwie kilku wywołań metody bez konieczności zarządzania konfiguracją po stronie serwera.

Sprawdzanie efektów pracy

Uruchom aplikację w emulatorze Androida. Powinien natychmiast wyświetlić się ekran logowania. Kliknij przycisk Zaloguj się za pomocą adresu e-mail, a następnie utwórz konto. Jeśli wszystko zostało prawidłowo zaimplementowane, powinien wyświetlić się ekran przesyłania wiadomości.

Po zalogowaniu się otwórz w przeglądarce interfejs Pakietu emulatorów Firebase i kliknij kartę Uwierzytelnianie, aby wyświetlić konto tego użytkownika zalogowanego jako pierwsze.

7. Czytanie wiadomości

W tym kroku dodamy funkcję odczytu i wyświetlania wiadomości przechowywanych w bazie danych czasu rzeczywistego.

Importuj przykładowe wiadomości

W interfejsie pakietu emulatorów Firebase kliknij kartę Baza danych czasu rzeczywistego.
Przeciągnij plik initial_messages.json z lokalnej kopii repozytorium ćwiczeń z programowania i upuść go w przeglądarce danych.

W węźle messages bazy danych powinno być teraz kilka komunikatów.

Odczyt danych

Synchronizowanie wiadomości

W tej sekcji dodajemy kod, który synchronizuje nowo dodane wiadomości z interfejsem aplikacji przez:

Inicjowanie Bazy danych czasu rzeczywistego Firebase i dodanie detektora do obsługi zmian wprowadzonych w danych.
Aktualizuję adapter RecyclerView, aby wyświetlały się nowe wiadomości.
Dodaj zmienne instancji bazy danych z innymi zmiennymi instancji Firebase w klasie MainActivity:

MainActivity.kt

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

Zmodyfikuj metodę onCreate() MainActivity w komentarzu // Initialize Realtime Database and FirebaseRecyclerAdapter za pomocą kodu zdefiniowanego poniżej. Ten kod dodaje wszystkie istniejące wiadomości z Bazy danych czasu rzeczywistego, a następnie nasłuchuje nowych wpisów podrzędnych w ścieżce messages w Bazie danych czasu rzeczywistego Firebase. W przypadku każdej wiadomości dodaje do UI nowy element:

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

Następnie w klasie FriendlyMessageAdapter.kt zaimplementuj metodę bind() w klasie wewnętrznej MessageViewHolder():

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

Musimy też wyświetlać wiadomości będące obrazami, więc zaimplementuj też metodę bind() w klasie wewnętrznej ImageMessageViewHolder():

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

Na koniec wróć do funkcji MainActivity i zacznij nasłuchiwać aktualizacji Bazy danych czasu rzeczywistego Firebase. Zaktualizuj metody onPause() i onResume() w MainActivity, jak pokazano poniżej:

MainActivity.kt

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

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

Testowanie synchronizacji wiadomości

Kliknij Wykonaj ( ).
W interfejsie Pakietu emulatorów wróć na kartę Baza danych czasu rzeczywistego i ręcznie dodaj nową wiadomość. Sprawdź, czy komunikat wyświetla się w aplikacji na Androida:

Gratulacje! Udało Ci się dodać do swojej aplikacji bazę danych czasu rzeczywistego.

8. Wysyłanie wiadomości

Wdrażanie wysyłania SMS-ów

W tej sekcji dodasz możliwość wysyłania SMS-ów przez użytkowników aplikacji. Fragment kodu poniżej nasłuchuje zdarzeń kliknięcia przycisku wysyłania, tworzy nowy obiekt FriendlyMessage z zawartością pola wiadomości i przenosi wiadomość do bazy danych. Metoda push() dodaje automatycznie generowany identyfikator do ścieżki przekazywanego obiektu. Identyfikatory te są porządkowane w kolejności, co daje pewność, że nowe wiadomości będą dodawane na końcu listy.

Zaktualizuj odbiornik kliknięć przycisku wysyłania w metodzie onCreate() w klasie MainActivity. Ten kod znajduje się już na dole metody onCreate(). Zaktualizuj treść onClick() tak, aby pasowała do poniższego kodu:

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

Wdrażanie wysyłania wiadomości graficznych

W tej sekcji dodasz możliwość wysyłania przez użytkowników aplikacji wiadomości graficznych. Aby utworzyć wiadomość z obrazem, wykonaj te czynności:

Wybierz obraz
Obsługa wyboru obrazu
Zapisz tymczasowy komunikat o obrazie w bazie danych czasu rzeczywistego
Rozpocznij przesyłanie wybranego obrazu
Po zakończeniu przesyłania zaktualizuj adres URL wiadomości o obrazie do adresu przesłanego obrazu

Wybierz obraz

Aby dodać obrazy, to ćwiczenie w Codelabs korzysta z Cloud Storage dla Firebase. Cloud Storage to dobre miejsce do przechowywania danych binarnych aplikacji.

Wybieranie obrazu i zapisywanie wiadomości tymczasowej

Gdy użytkownik wybierze obraz, uruchamiany jest proces wyboru obrazu Intent. Jest on już zaimplementowany w kodzie na końcu metody onCreate(). Po zakończeniu wywołuje metodę onImageSelected() metody MainActivity. Korzystając z poniższego fragmentu kodu, napiszesz do bazy danych komunikat z tymczasowym adresem URL obrazu informujący o przesyłaniu obrazu.

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

Prześlij obraz i zaktualizuj wiadomość

Dodaj metodę putImageInStorage() do metody MainActivity. Jest ona wywoływana w języku onImageSelected(), aby rozpocząć przesyłanie wybranego obrazu. Po zakończeniu przesyłania zaktualizujesz komunikat, używając odpowiedniego obrazu.

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

Testuj wysyłanie wiadomości

W Android Studio kliknij przycisk Uruchom.
W emulatorze Androida wpisz wiadomość, a potem kliknij przycisk wysyłania. Nowa wiadomość powinna być widoczna w interfejsie aplikacji oraz w interfejsie pakietu emulatorów Firebase.
W emulatorze Androida kliknij „+”. obraz, aby wybrać obraz na urządzeniu. Nowa wiadomość powinna być najpierw widoczna jako obraz zastępczy, a po zakończeniu przesyłania obrazu – z wybranym obrazem. Nowa wiadomość powinna być też widoczna w interfejsie Pakietu emulatorów, zwłaszcza jako obiekt na karcie Baza danych czasu rzeczywistego i jako obiekt blob na karcie Pamięć.

9. Gratulacje!

Udało Ci się utworzyć aplikację do obsługi czatu w czasie rzeczywistym przy użyciu Firebase.

Zdobyte informacje

Uwierzytelnianie Firebase
Baza danych czasu rzeczywistego Firebase
Cloud Storage dla Firebase

Teraz spróbuj wykorzystać informacje z tego ćwiczenia z programowania, aby dodać Firebase do swojej aplikacji na Androida. Więcej informacji o Firebase znajdziesz na stronie firebase.google.com.

Jeśli chcesz dowiedzieć się, jak skonfigurować prawdziwy projekt Firebase i używać prawdziwych zasobów Firebase (zamiast projektu demonstracyjnego i tylko emulowanych zasobów), przejdź do następnego kroku.

Uwaga: nawet po skonfigurowaniu prawdziwego projektu Firebase, a szczególnie podczas tworzenia prawdziwej aplikacji, do programowania i testowania zalecamy korzystanie z Pakietu emulatorów lokalnych Firebase.

10. Opcjonalnie: tworzenie i konfigurowanie projektu Firebase

W tym kroku utworzysz prawdziwy projekt Firebase i aplikację Firebase na Androida, których będziesz używać w tym ćwiczeniu. Do aplikacji dodasz też konfigurację Firebase dla swojej aplikacji. Na koniec skonfigurujesz rzeczywiste zasoby Firebase do wykorzystania w aplikacji.

Tworzenie projektu Firebase

W przeglądarce otwórz konsolę Firebase.
Wybierz Dodaj projekt.
Wybierz lub wpisz nazwę projektu. Możesz użyć dowolnej nazwy.
Do tego ćwiczenia z programowania nie potrzebujesz Google Analytics, więc możesz pominąć jego włączenie w projekcie.
Kliknij Utwórz projekt. Gdy projekt będzie gotowy, kliknij Dalej.

Dodaj Firebase do swojego projektu na Androida

Zanim zaczniesz ten krok, pobierz skrót SHA1 swojej aplikacji. Uruchom to polecenie w lokalnym katalogu build-android-start, aby określić identyfikator SHA1 swojego klucza debugowania:

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

Powinny wyświetlić się dane wyjściowe podobne do tych powyżej. Ważny wiersz to hasz SHA1. Jeśli nie możesz znaleźć swojego skrótu SHA1, więcej informacji znajdziesz na tej stronie.

Wróć do konsoli Firebase i wykonaj te czynności, aby zarejestrować swój projekt na Androida w projekcie Firebase:

Na ekranie przeglądu nowego projektu kliknij ikonę Androida, aby uruchomić przepływ pracy konfiguracji:
Na następnym ekranie wpisz com.google.firebase.codelab.friendlychat jako nazwę pakietu aplikacji.
Kliknij Zarejestruj aplikację, a następnie Pobierz google-services.json, aby pobrać plik konfiguracji Firebase.
Skopiuj plik google-services.json do katalogu app swojego projektu na Androida.
Pomiń kolejne kroki wymienione w procesie konfiguracji w konsoli (zostały one już wykonane w projekcie build-android-start).
Synchronizuj projekt z plikami Gradle, aby upewnić się, że aplikacja ma dostęp do wszystkich zależności. Na pasku narzędzi Android Studio wybierz Plik > Synchronizowanie projektu z plikami Gradle Aby zmiany konfiguracji zostały wprowadzone, może być też konieczne uruchomienie poleceń Build/Clear Project (Skompiluj/Wyczyść projekt) i Build/Rebuild Project.

Skonfiguruj Uwierzytelnianie Firebase

Zanim Twoja aplikacja będzie mogła korzystać z interfejsów API uwierzytelniania Firebase w imieniu swoich użytkowników, musisz włączyć Uwierzytelnianie Firebase oraz dostawców logowania, których chcesz używać w aplikacji.

W konsoli Firebase w panelu użytkownika po lewej stronie wybierz Uwierzytelnianie.
Wybierz kartę Metoda logowania.
Kliknij E-mail/hasło, a następnie ustaw przełącznik w pozycji włączonej (niebieskiej).
Kliknij Google, a następnie ustaw przełącznik w pozycji włączonej (niebieskiej) i ustaw adres e-mail pomocy dotyczącej projektu.

Jeśli w dalszej części tego ćwiczenia w Codelabs wystąpi błąd i pojawi się komunikat „CONFIGURATION_NOT_FOUND”, wróć do tego kroku i dokładnie sprawdź swoją pracę.

Skonfiguruj Bazę danych czasu rzeczywistego

Aplikacja objęta tym ćwiczeniem w Codelabs przechowuje wiadomości czatu w bazie danych czasu rzeczywistego Firebase. W tej sekcji utworzymy bazę danych i skonfigurujemy jej zabezpieczenia za pomocą języka konfiguracji JSON nazywanego regułami zabezpieczeń Firebase.

W konsoli Firebase w panelu użytkownika po lewej stronie wybierz Baza danych czasu rzeczywistego.
Kliknij Utwórz bazę danych, aby utworzyć nową instancję bazy danych czasu rzeczywistego. Gdy pojawi się prośba, wybierz region us-central1, a następnie kliknij Dalej.
Gdy pojawi się pytanie o reguły zabezpieczeń, wybierz tryb blokady, a następnie kliknij Włącz.

Po utworzeniu instancji bazy danych wybierz kartę Reguły, a następnie zaktualizuj konfigurację reguł w ten sposób:

 {
   "rules": {
     "messages": {
       ".read": "auth.uid != null",
       ".write": "auth.uid != null"
     }
   }
 }

Więcej informacji o działaniu reguł zabezpieczeń (w tym dokumentację zmiennej „auth”) znajdziesz w dokumentacji zabezpieczeń Bazy danych czasu rzeczywistego.

Skonfiguruj Cloud Storage dla Firebase

W konsoli Firebase w panelu użytkownika po lewej stronie wybierz Miejsce na dane.
Kliknij Rozpocznij, aby włączyć Cloud Storage w swoim projekcie.
Postępuj zgodnie z instrukcjami wyświetlanymi w oknie, aby skonfigurować zasobnik, stosując sugerowane wartości domyślne.

Połącz z zasobami Firebase

W poprzednim kroku tego ćwiczenia z programowania dodano do MainActivity.kt następujące elementy. Ten blok warunkowy połączył Twój projekt na Androida z Pakietem emulatorów Firebase.

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

Jeśli chcesz połączyć aplikację z nowym prawdziwym projektem Firebase i jego prawdziwymi zasobami Firebase, usuń ten blokadę lub uruchom aplikację w trybie wersji, tak aby BuildConfig.DEBUG miała wartość false.

Ćwiczenie z programowania w Firebase na Androida – czat z łatwością tworzenia

1. Omówienie

Czego się nauczysz

Czego potrzebujesz

2. Pobieranie przykładowego kodu

Klonowanie repozytorium

Importuj do Android Studio

Sprawdź zależności

3. Instalowanie interfejsu wiersza poleceń Firebase

Instalowanie interfejsu wiersza poleceń Firebase

Zaloguj się

4. Połącz się z Pakietem emulatorów Firebase

Uruchom emulatory

Połącz aplikację

5. Uruchom aplikację startową

Dodaj google-services.json

Uruchom aplikację

6. Włącz uwierzytelnianie

Dodawanie podstawowych funkcji logowania

Sprawdź bieżącego użytkownika

Implementacja ekranu logowania

Sprawdzanie efektów pracy

7. Czytanie wiadomości

Importuj przykładowe wiadomości

Odczyt danych

Synchronizowanie wiadomości

MainActivity.kt

Testowanie synchronizacji wiadomości

8. Wysyłanie wiadomości

Wdrażanie wysyłania SMS-ów

Wdrażanie wysyłania wiadomości graficznych

Wybierz obraz

Wybieranie obrazu i zapisywanie wiadomości tymczasowej

Prześlij obraz i zaktualizuj wiadomość

MainActivity.kt

Testuj wysyłanie wiadomości

9. Gratulacje!

Zdobyte informacje

10. Opcjonalnie: tworzenie i konfigurowanie projektu Firebase

Tworzenie projektu Firebase

Dodaj Firebase do swojego projektu na Androida

Skonfiguruj Uwierzytelnianie Firebase

Skonfiguruj Bazę danych czasu rzeczywistego

Skonfiguruj Cloud Storage dla Firebase

Połącz z zasobami Firebase