Catch up on everything announced at Firebase Summit, and learn how Firebase can help you accelerate app development and run your app with confidence. Learn More

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

จัดทุกอย่างให้เป็นระเบียบอยู่เสมอด้วยคอลเล็กชัน บันทึกและจัดหมวดหมู่เนื้อหาตามค่ากำหนดของคุณ

FirebaseUI เป็นไลบรารีที่สร้างขึ้นจาก Firebase Authentication SDK ที่มีโฟลว์ UI แบบดรอปอินสำหรับใช้ในแอปของคุณ FirebaseUI ให้ประโยชน์ดังต่อไปนี้:

  • ผู้ให้บริการหลายราย - ขั้นตอนการลงชื่อเข้าใช้สำหรับอีเมล/รหัสผ่าน ลิงก์อีเมล การตรวจสอบสิทธิ์โทรศัพท์ การลงชื่อเข้าใช้ Google การเข้าสู่ระบบ Facebook การเข้าสู่ระบบ Twitter และการเข้าสู่ระบบ GitHub
  • การจัดการบัญชี - โฟลว์ในการจัดการงานการจัดการบัญชี เช่น การสร้างบัญชีและการรีเซ็ตรหัสผ่าน
  • การเชื่อมโยงบัญชี - โฟลว์เพื่อเชื่อมโยงบัญชีผู้ใช้ระหว่างผู้ให้บริการข้อมูลประจำตัวอย่างปลอดภัย
  • การอัปเกรดผู้ใช้ที่ไม่ระบุชื่อ - โฟลว์เพื่ออัปเกรดผู้ใช้ที่ไม่ระบุชื่ออย่างปลอดภัย
  • ธีมที่กำหนดเอง - ปรับแต่งรูปลักษณ์ของ FirebaseUI ให้เข้ากับแอปของคุณ นอกจากนี้ เนื่องจาก FirebaseUI เป็นโอเพ่นซอร์ส คุณจึงสามารถแยกโปรเจ็กต์และปรับแต่งให้ตรงตามความต้องการของคุณได้
  • Smart Lock สำหรับรหัสผ่าน - การผสานรวมกับ Smart Lock สำหรับรหัส ผ่านโดยอัตโนมัติเพื่อการลงชื่อเข้าใช้ข้ามอุปกรณ์ได้อย่างรวดเร็ว

ก่อนจะเริ่ม

  1. หากคุณยังไม่ได้ เพิ่ม Firebase ในโครงการ Android ของคุณ

  2. เพิ่มการพึ่งพาสำหรับ FirebaseUI ให้กับไฟล์ build.gradle ระดับแอปของคุณ หากคุณต้องการสนับสนุนการลงชื่อเข้าใช้ด้วย Facebook หรือ Twitter ให้รวม Facebook และ Twitter SDK ด้วย:

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

  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:

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

Kotlin+KTX

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

หากต้องการเริ่มขั้นตอนการลงชื่อเข้าใช้ FirebaseUI ให้สร้างความตั้งใจในการลงชื่อเข้าใช้ด้วยวิธีลงชื่อเข้าใช้ที่คุณต้องการ:

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

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)

เมื่อขั้นตอนการลงชื่อเข้าใช้เสร็จสมบูรณ์ คุณจะได้รับผลลัพธ์ใน onSignInResult :

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

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

ตั้งค่าวิธีการลงชื่อเข้าใช้

  1. ใน คอนโซล Firebase ให้เปิดส่วนการ ตรวจสอบสิทธิ์ บนแท็บ วิธีการลงชื่อเข้า ใช้ เปิดใช้งานผู้ให้บริการ อีเมล/รหัสผ่าน โปรดทราบว่าต้องเปิดใช้งานการลงชื่อเข้าใช้อีเมล/รหัสผ่านเพื่อใช้การลงชื่อเข้าใช้ลิงก์อีเมล

  2. ในส่วนเดียวกัน ให้เปิดใช้งานวิธีการลงชื่อ เข้าใช้ลิงก์อีเมล (ลงชื่อเข้าใช้แบบไม่มีรหัสผ่าน) แล้วคลิก บันทึก

  3. คุณจะต้องเปิดใช้งานลิงก์แบบไดนามิกของ Firebase เพื่อใช้การลงชื่อเข้าใช้ลิงก์อีเมล ใน คอนโซล Firebase ให้คลิกที่ ลิงก์แบบไดนามิก ภายใต้ Engage ในแถบนำทาง คลิก เริ่มต้นใช้ งานและเพิ่มโดเมน โดเมนที่คุณเลือกที่นี่จะปรากฏในลิงก์อีเมลที่ส่งถึงผู้ใช้ของคุณ

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

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

    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)
  5. หากคุณต้องการรับลิงก์ในกิจกรรมใดโดยเฉพาะ โปรดทำตามขั้นตอนที่ระบุไว้ ที่นี่ มิฉะนั้น ลิงก์จะเปลี่ยนเส้นทางไปยังกิจกรรมตัวเรียกใช้ของคุณ

  6. เมื่อคุณพบลิงก์ในรายละเอียดแล้ว คุณจะต้องโทรติดต่อฝ่ายตรวจสอบว่าเราสามารถจัดการให้คุณได้ หากทำได้ คุณต้องส่งต่อให้เราทาง setEmailLink

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

    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)
        }
    }
  7. รองรับ การลงชื่อเข้าใช้ลิงก์อีเมลข้ามอุปกรณ์ ซึ่งหมายความว่าลิงก์ที่ส่งผ่านแอป Android ของคุณสามารถใช้เข้าสู่ระบบบนเว็บหรือแอป Apple ได้ โดยค่าเริ่มต้น การสนับสนุนข้ามอุปกรณ์จะเปิดใช้งาน คุณสามารถปิดใช้งานได้โดยการเรียก setForceSameDevice บนอินสแตนซ์ EmailBuilder

    ดูข้อมูลเพิ่มเติม ที่ FirebaseUI-Web และ FirebaseUI-iOS

ออกจากระบบ

FirebaseUI มีวิธีอำนวยความสะดวกในการออกจากระบบตรวจสอบสิทธิ์ Firebase รวมถึงผู้ให้บริการข้อมูลประจำตัวทางสังคมทั้งหมด:

Java

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

Kotlin+KTX

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

คุณยังสามารถลบบัญชีผู้ใช้ได้อย่างสมบูรณ์:

Java

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

Kotlin+KTX

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

การปรับแต่ง

โดยค่าเริ่มต้น FirebaseUI จะใช้ AppCompat สำหรับการจัดรูปแบบ ซึ่งหมายความว่าจะใช้โทนสีของแอปของคุณโดยธรรมชาติ หากคุณต้องการการปรับแต่งเพิ่มเติม คุณสามารถส่งธีมและโลโก้ไปยังตัวสร้างความ Intent ในการลงชื่อเข้าใช้:

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

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)

คุณยังสามารถกำหนดนโยบายความเป็นส่วนตัวและข้อกำหนดในการให้บริการแบบกำหนดเองได้:

Java

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

Kotlin+KTX

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

ขั้นตอนถัดไป