إضافة تسجيل الدخول بسهولة إلى تطبيق Android باستخدام FirebaseUI

FirebaseUI هي مكتبة تم إنشاؤها على حزمة تطوير البرامج (SDK) لميزة "المصادقة في Firebase"، وهي توفّر مسارات واجهة مستخدم سهلة الاستخدام في تطبيقك. وتوفّر FirebaseUI المزايا التالية:

  • مزوّدو خدمات متعدّدون: عمليات تسجيل الدخول باستخدام عنوان البريد الإلكتروني/كلمة المرور، ورابط البريد الإلكتروني، و مصادقة الهاتف، وتسجيل الدخول باستخدام حساب Google، وتسجيل الدخول باستخدام حساب Facebook، وتسجيل الدخول باستخدام حساب Twitter، وتسجيل الدخول باستخدام حساب GitHub
  • إدارة الحساب: مسارات لمعالجة مهام إدارة الحساب، مثل إنشاء الحساب وإعادة ضبط كلمة المرور
  • ربط الحساب: عمليات لربط حسابات المستخدمين بأمان على مستوى مقدّمي خدمات ملف التعريف
  • ترقية المستخدم المجهول: مسارات لترقية المستخدمين المجهولين بأمان
  • المظاهر المخصّصة: يمكنك تخصيص مظهر FirebaseUI ليناسب تطبيقك. بالإضافة إلى ذلك، بما أنّ FirebaseUI مفتوح المصدر، يمكنك إنشاء نسخة من المشروع وتخصيصه وفقًا لاحتياجاتك تمامًا.
  • Smart Lock لكلمات المرور: دمج تلقائي مع Smart Lock لكلمات المرور لتسجيل الدخول بسرعة على جميع الأجهزة

قبل البدء

  1. أضِف Firebase إلى مشروع Android، في حال لم يسبق لك إجراء ذلك.

  2. أضِف التبعيات لـ FirebaseUI إلى ملف build.gradle على مستوى التطبيق. إذا أردت إتاحة تسجيل الدخول باستخدام Facebook أو Twitter، يجب أيضًا تضمين حِزم تطوير البرامج (SDK) لكل من Facebook وTwitter:

    dependencies {
    // ...

    implementation 'com.firebaseui:firebase-ui-auth:7.2.0'

    // Required only if Facebook login support is required
    // Find the latest Facebook SDK releases here: https://goo.gl/Ce5L94
    implementation 'com.facebook.android:facebook-android-sdk:8.x'
}

    تحتوي حزمة تطوير البرامج (SDK) لـ FirebaseUI Auth على تبعيات ناتجة عن حزمة تطوير البرامج (SDK) لمنصّة Firebase و حزمة تطوير البرامج (SDK) لخدمات Google Play.

  3. في وحدة تحكّم Firebase، افتح قسم المصادقة وفعِّل methods تسجيل الدخول التي تريد إتاحتها. تتطلّب بعض طُرق تسجيل الدخول معلومات إضافية، تكون عادةً متاحة في وحدة تحكّم المطوّر للخدمة.

  4. في حال تفعيل ميزة "تسجيل الدخول باستخدام حساب Google":

    1. عندما يُطلب منك ذلك في وحدة التحكّم، نزِّل ملف إعدادات Firebase المعدَّل (google-services.json)، والذي يحتوي الآن على معلومات عميل OAuth المطلوبة لميزة "تسجيل الدخول باستخدام حساب Google".

    2. انقل ملف الضبط المعدَّل هذا إلى مشروعك على "استوديو Android"، مع استبدال ملف الضبط المقابل الذي أصبح قديمًا. (اطّلِع على مقالة إضافة Firebase إلى مشروع Android).

    3. إذا لم تكن قد حدّدت بصمة SHA لتطبيقك بعد، يمكنك إجراء ذلك من صفحة الإعدادات في وحدة تحكّم Firebase. اطّلِع على مصادقة العميل لمعرفة تفاصيل حول كيفية الحصول على بصمة SHA لتطبيقك.

  5. إذا كنت تتيح تسجيل الدخول باستخدام Facebook أو Twitter، أضِف موارد سلاسل إلى strings.xml تحدّد المعلومات التعريفية المطلوبة من كل مقدّم خدمة:

    
<resources>
  <!-- Facebook application ID and custom URL scheme (app ID prefixed by 'fb'). -->
  <string name="facebook_application_id" translatable="false">YOUR_APP_ID</string>
  <string name="facebook_login_protocol_scheme" translatable="false">fbYOUR_APP_ID</string>
</resources>

تسجيل الدخول

أنشئ ActivityResultLauncher يسجِّل طلب استدعاء لعقد نتيجة النشاط في FirebaseUI:

Kotlin

// See: https://developer.android.com/training/basics/intents/result
private val signInLauncher = registerForActivityResult(
    FirebaseAuthUIActivityResultContract(),
) { res ->
    this.onSignInResult(res)
}
FirebaseUIActivity.kt

Java

// See: https://developer.android.com/training/basics/intents/result
private final ActivityResultLauncher<Intent> signInLauncher = registerForActivityResult(
        new FirebaseAuthUIActivityResultContract(),
        new ActivityResultCallback<FirebaseAuthUIAuthenticationResult>() {
            @Override
            public void onActivityResult(FirebaseAuthUIAuthenticationResult result) {
                onSignInResult(result);
            }
        }
);
FirebaseUIActivity.java

لبدء عملية تسجيل الدخول في FirebaseUI، أنشئ نية تسجيل دخول باستخدام methods methods المفضّلة لتسجيل الدخول:

Kotlin

// Choose authentication providers
val providers = arrayListOf(
    AuthUI.IdpConfig.EmailBuilder().build(),
    AuthUI.IdpConfig.PhoneBuilder().build(),
    AuthUI.IdpConfig.GoogleBuilder().build(),
    AuthUI.IdpConfig.FacebookBuilder().build(),
    AuthUI.IdpConfig.TwitterBuilder().build(),
)

// Create and launch sign-in intent
val signInIntent = AuthUI.getInstance()
    .createSignInIntentBuilder()
    .setAvailableProviders(providers)
    .build()
signInLauncher.launch(signInIntent)
FirebaseUIActivity.kt

Java

// Choose authentication providers
List<AuthUI.IdpConfig> providers = Arrays.asList(
        new AuthUI.IdpConfig.EmailBuilder().build(),
        new AuthUI.IdpConfig.PhoneBuilder().build(),
        new AuthUI.IdpConfig.GoogleBuilder().build(),
        new AuthUI.IdpConfig.FacebookBuilder().build(),
        new AuthUI.IdpConfig.TwitterBuilder().build());

// Create and launch sign-in intent
Intent signInIntent = AuthUI.getInstance()
        .createSignInIntentBuilder()
        .setAvailableProviders(providers)
        .build();
signInLauncher.launch(signInIntent);
FirebaseUIActivity.java

عند اكتمال عملية تسجيل الدخول، ستتلقّى النتيجة في onSignInResult:

Kotlin

private fun onSignInResult(result: FirebaseAuthUIAuthenticationResult) {
    val response = result.idpResponse
    if (result.resultCode == RESULT_OK) {
        // Successfully signed in
        val user = FirebaseAuth.getInstance().currentUser
        // ...
    } else {
        // Sign in failed. If response is null the user canceled the
        // sign-in flow using the back button. Otherwise check
        // response.getError().getErrorCode() and handle the error.
        // ...
    }
}
FirebaseUIActivity.kt

Java

private void onSignInResult(FirebaseAuthUIAuthenticationResult result) {
    IdpResponse response = result.getIdpResponse();
    if (result.getResultCode() == RESULT_OK) {
        // Successfully signed in
        FirebaseUser user = FirebaseAuth.getInstance().getCurrentUser();
        // ...
    } else {
        // Sign in failed. If response is null the user canceled the
        // sign-in flow using the back button. Otherwise check
        // response.getError().getErrorCode() and handle the error.
        // ...
    }
}
FirebaseUIActivity.java

إعداد طُرق تسجيل الدخول

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

  2. في القسم نفسه، فعِّل رابط البريد الإلكتروني (تسجيل الدخول بدون كلمة مرور)، ثم انقر على حفظ.

  3. عليك أيضًا تفعيل "روابط Firebase الديناميكية" لاستخدام ميزة تسجيل الدخول باستخدام رابط البريد الإلكتروني. فيconsole Firebase، انقر على الروابط الديناميكية ضمن التفاعل في شريط التنقّل. انقر على البدء وأضِف نطاقًا. سيظهر النطاق الذي تختاره هنا في رسائل البريد الإلكتروني والروابط المُرسَلة إلى المستخدمين.

  4. يمكنك تفعيل ميزة تسجيل الدخول باستخدام رابط البريد الإلكتروني في FirebaseUI من خلال استدعاء enableEmailLinkSignIn في مثيل EmailBuilder. ستحتاج أيضًا إلى تقديم عنصر ActionCodeSettings صالح مع ضبط setHandleCodeInApp على "صحيح". بالإضافة إلى ذلك، عليك إضافة عنوان URL الذي ترسله إلى setUrl إلى القائمة المسموح بها، وذلك في وحدة تحكّم Firebase، ضمن "المصادقة" -> طُرق تسجيل الدخول -> النطاقات المعتمَدة.

    Kotlin

    val actionCodeSettings = ActionCodeSettings.newBuilder()
    .setAndroidPackageName( // yourPackageName=
        "...", // installIfNotAvailable=
        true, // minimumVersion=
        null,
    )
    .setHandleCodeInApp(true) // This must be set to true
    .setUrl("https://google.com") // This URL needs to be whitelisted
    .build()

val providers = listOf(
    EmailBuilder()
        .enableEmailLinkSignIn()
        .setActionCodeSettings(actionCodeSettings)
        .build(),
)
val signInIntent = AuthUI.getInstance()
    .createSignInIntentBuilder()
    .setAvailableProviders(providers)
    .build()
signInLauncher.launch(signInIntent)
    FirebaseUIActivity.kt

    Java

    ActionCodeSettings actionCodeSettings = ActionCodeSettings.newBuilder()
        .setAndroidPackageName(
                /* yourPackageName= */ "...",
                /* installIfNotAvailable= */ true,
                /* minimumVersion= */ null)
        .setHandleCodeInApp(true) // This must be set to true
        .setUrl("https://google.com") // This URL needs to be whitelisted
        .build();

List<AuthUI.IdpConfig> providers = Arrays.asList(
        new AuthUI.IdpConfig.EmailBuilder()
                .enableEmailLinkSignIn()
                .setActionCodeSettings(actionCodeSettings)
                .build()
);
Intent signInIntent = AuthUI.getInstance()
        .createSignInIntentBuilder()
        .setAvailableProviders(providers)
        .build();
signInLauncher.launch(signInIntent);
    FirebaseUIActivity.java

  5. إذا أردت العثور على الرابط في نشاط معيّن، يُرجى اتّباع الخطوات الموضّحة هنا. وإلّا، سيؤدي الرابط إلى إعادة توجيهك إلى نشاطك على مشغّل التطبيقات.

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

    Kotlin

    if (AuthUI.canHandleIntent(intent)) {
    val extras = intent.extras ?: return
    val link = extras.getString("email_link_sign_in")
    if (link != null) {
        val signInIntent = AuthUI.getInstance()
            .createSignInIntentBuilder()
            .setEmailLink(link)
            .setAvailableProviders(providers)
            .build()
        signInLauncher.launch(signInIntent)
    }
}
    FirebaseUIActivity.kt

    Java

    if (AuthUI.canHandleIntent(getIntent())) {
    if (getIntent().getExtras() == null) {
        return;
    }
    String link = getIntent().getExtras().getString("email_link_sign_in");
    if (link != null) {
        Intent signInIntent = AuthUI.getInstance()
                .createSignInIntentBuilder()
                .setEmailLink(link)
                .setAvailableProviders(providers)
                .build();
        signInLauncher.launch(signInIntent);
    }
}
    FirebaseUIActivity.java

  7. اختياري: تتوفّر ميزة تسجيل الدخول باستخدام رابط البريد الإلكتروني على جميع الأجهزة، ما يعني أنّه يمكن استخدام الرابط المُرسَل عبر تطبيق Android لتسجيل الدخول على الويب أو تطبيقات Apple. يكون خيار "التوافق مع جميع الأجهزة" مفعَّلاً تلقائيًا. يمكنك إيقافه من خلال استدعاء setForceSameDevice في مثيل EmailBuilder.

    اطّلِع على FirebaseUI-Web وFirebaseUI-iOS لمزيد من المعلومات.

تسجيل الخروج

توفّر FirebaseUI طُرقًا سهلة لتسجيل الخروج من Firebase Authentication بالإضافة إلى جميع مقدّمي الهوية الاجتماعية:

Kotlin

AuthUI.getInstance()
    .signOut(this)
    .addOnCompleteListener {
        // ...
    }
FirebaseUIActivity.kt

Java

AuthUI.getInstance()
        .signOut(this)
        .addOnCompleteListener(new OnCompleteListener<Void>() {
            public void onComplete(@NonNull Task<Void> task) {
                // ...
            }
        });
FirebaseUIActivity.java

يمكنك أيضًا حذف حساب المستخدم بالكامل باتّباع الخطوات التالية:

Kotlin

AuthUI.getInstance()
    .delete(this)
    .addOnCompleteListener {
        // ...
    }
FirebaseUIActivity.kt

Java

AuthUI.getInstance()
        .delete(this)
        .addOnCompleteListener(new OnCompleteListener<Void>() {
            @Override
            public void onComplete(@NonNull Task<Void> task) {
                // ...
            }
        });
FirebaseUIActivity.java

التخصيص

تستخدِم FirebaseUI تلقائيًا مكتبة AppCompat لتطبيق المظاهر، ما يعني أنّها ستتّبع تلقائيًا مخطط ألوان تطبيقك. إذا كنت بحاجة إلى مزيد من التخصيص، يمكنك تمرير مظهر وشعار إلى أداة إنشاء Intent تسجيل الدخول:

Kotlin

val signInIntent = AuthUI.getInstance()
    .createSignInIntentBuilder()
    .setAvailableProviders(providers)
    .setLogo(R.drawable.my_great_logo) // Set logo drawable
    .setTheme(R.style.MySuperAppTheme) // Set theme
    .build()
signInLauncher.launch(signInIntent)
FirebaseUIActivity.kt

Java

Intent signInIntent = AuthUI.getInstance()
        .createSignInIntentBuilder()
        .setAvailableProviders(providers)
        .setLogo(R.drawable.my_great_logo)      // Set logo drawable
        .setTheme(R.style.MySuperAppTheme)      // Set theme
        .build();
signInLauncher.launch(signInIntent);
FirebaseUIActivity.java

يمكنك أيضًا إعداد سياسة خصوصية وبنود خدمة مخصّصة:

Kotlin

val signInIntent = AuthUI.getInstance()
    .createSignInIntentBuilder()
    .setAvailableProviders(providers)
    .setTosAndPrivacyPolicyUrls(
        "https://example.com/terms.html",
        "https://example.com/privacy.html",
    )
    .build()
signInLauncher.launch(signInIntent)
FirebaseUIActivity.kt

Java

Intent signInIntent = AuthUI.getInstance()
        .createSignInIntentBuilder()
        .setAvailableProviders(providers)
        .setTosAndPrivacyPolicyUrls(
                "https://example.com/terms.html",
                "https://example.com/privacy.html")
        .build();
signInLauncher.launch(signInIntent);
FirebaseUIActivity.java

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

  • لمزيد من المعلومات عن استخدام FirebaseUI وتخصيصه، اطّلِع على ملف README على GitHub.
  • إذا واجهت مشكلة في FirebaseUI وأردت الإبلاغ عنها، استخدِم أداة تتبُّع المشاكل في GitHub.