เพิ่มการลงชื่อเข้าใช้แอป Android ของคุณอย่างง่ายดายด้วย FirebaseUI

FirebaseUI เป็นไลบรารีที่สร้างขึ้นจาก SDK การตรวจสอบสิทธิ์ของ Firebase ซึ่งจัดเตรียมโฟลว์ UI แบบดรอปอินสำหรับใช้ในแอปของคุณ 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'
}

    FirebaseUI Auth SDK มีการพึ่งพาสกรรมกริยาบน Firebase SDK และ SDK บริการ Google Play

  3. ใน คอนโซล Firebase ให้เปิดส่วน การรับรองความถูกต้อง และเปิดใช้งานวิธีการลงชื่อเข้าใช้ที่คุณต้องการสนับสนุน วิธีการลงชื่อเข้าใช้บางวิธีต้องการข้อมูลเพิ่มเติม ซึ่งโดยปกติจะมีให้ในคอนโซลนักพัฒนาซอฟต์แวร์ของบริการ

  4. หากคุณเปิดใช้งานการลงชื่อเข้าใช้ Google:

    1. เมื่อได้รับแจ้งในคอนโซล ให้ดาวน์โหลดไฟล์การกำหนดค่า Firebase ที่อัปเดต ( google-services.json ) ซึ่งขณะนี้มีข้อมูลไคลเอ็นต์ OAuth ที่จำเป็นสำหรับการลงชื่อเข้าใช้ Google

    2. ย้ายไฟล์กำหนดค่าที่อัปเดตนี้ไปยังโปรเจ็กต์ Android Studio แทนที่ ไฟล์กำหนดค่าที่เกี่ยวข้องซึ่งล้าสมัยแล้ว (ดู เพิ่ม 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+KTX

// 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 ให้สร้างความตั้งใจในการลงชื่อเข้าใช้ด้วยวิธีการลงชื่อเข้าใช้ที่คุณต้องการ:

Kotlin+KTX

// 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+KTX

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 เพื่อใช้การลงชื่อเข้าใช้ด้วยลิงก์อีเมล ใน คอนโซล Firebase ให้คลิก ลิงก์ไดนามิก ใต้ ส่วนมีส่วนร่วม ในแถบการนำทาง คลิกที่ เริ่มต้นใช้งาน และเพิ่มโดเมน โดเมนที่คุณเลือกที่นี่จะแสดงในลิงก์อีเมลที่ส่งถึงผู้ใช้ของคุณ

  4. คุณสามารถเปิดใช้งานการลงชื่อเข้าใช้ลิงก์อีเมลใน FirebaseUI ได้โดยการเรียก enableEmailLinkSignIn บนอินสแตนซ์ EmailBuilder คุณจะต้องจัดเตรียมออบเจกต์ ActionCodeSettings ที่ถูกต้องโดยตั้งค่า setHandleCodeInApp เป็น True นอกจากนี้ คุณต้องอนุญาต URL ที่คุณส่งไปที่ setUrl ซึ่งสามารถทำได้ใน คอนโซล Firebase ภายใต้การตรวจสอบสิทธิ์ -> วิธีการลงชื่อเข้าใช้ -> โดเมนที่ได้รับอนุญาต

    Kotlin+KTX

    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+KTX

    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+KTX

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+KTX

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 builder ที่ลงชื่อเข้าใช้ได้:

Kotlin+KTX

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+KTX

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