FirebaseUI เป็นไลบรารีที่สร้างขึ้นจาก SDK การตรวจสอบสิทธิ์ของ Firebase ซึ่งจัดเตรียมโฟลว์ UI แบบดรอปอินสำหรับใช้ในแอปของคุณ FirebaseUI ให้ประโยชน์ดังต่อไปนี้:
- ผู้ให้บริการหลายราย - ขั้นตอนการลงชื่อเข้าใช้สำหรับอีเมล/รหัสผ่าน ลิงก์อีเมล การยืนยันตัวตนทางโทรศัพท์ การลงชื่อเข้าใช้ Google การเข้าสู่ระบบ Facebook การเข้าสู่ระบบ Twitter และการเข้าสู่ระบบ GitHub
- การจัดการบัญชี - โฟลว์เพื่อจัดการงานการจัดการบัญชี เช่น การสร้างบัญชีและการรีเซ็ตรหัสผ่าน
- การเชื่อมโยงบัญชี - โฟลว์เพื่อเชื่อมโยงบัญชีผู้ใช้ระหว่างผู้ให้บริการข้อมูลประจำตัวอย่างปลอดภัย
- การอัปเกรดผู้ใช้ที่ไม่ระบุชื่อ - โฟลว์เพื่ออัปเกรดผู้ใช้ที่ไม่ระบุชื่ออย่างปลอดภัย
- ธีมที่กำหนดเอง - ปรับแต่งรูปลักษณ์ของ FirebaseUI เพื่อให้เข้ากับแอปของคุณ นอกจากนี้ เนื่องจาก FirebaseUI เป็นโอเพ่นซอร์ส คุณจึงสามารถแยกโครงการและปรับแต่งตามความต้องการของคุณได้
- Smart Lock สำหรับรหัสผ่าน - การรวมอัตโนมัติกับ Smart Lock สำหรับรหัสผ่าน เพื่อการลงชื่อเข้าใช้ข้ามอุปกรณ์ที่รวดเร็ว
ก่อนที่คุณจะเริ่มต้น
หากคุณยังไม่ได้ ดำเนินการ ให้เพิ่ม Firebase ในโครงการ Android ของคุณ
เพิ่มการอ้างอิงสำหรับ 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
ใน คอนโซล Firebase ให้เปิดส่วน การรับรองความถูกต้อง และเปิดใช้งานวิธีการลงชื่อเข้าใช้ที่คุณต้องการสนับสนุน วิธีการลงชื่อเข้าใช้บางวิธีต้องการข้อมูลเพิ่มเติม ซึ่งโดยปกติจะมีให้ในคอนโซลนักพัฒนาซอฟต์แวร์ของบริการ
หากคุณเปิดใช้งานการลงชื่อเข้าใช้ Google:
เมื่อได้รับแจ้งในคอนโซล ให้ดาวน์โหลดไฟล์การกำหนดค่า Firebase ที่อัปเดต (
google-services.json
) ซึ่งขณะนี้มีข้อมูลไคลเอ็นต์ OAuth ที่จำเป็นสำหรับการลงชื่อเข้าใช้ Googleย้ายไฟล์กำหนดค่าที่อัปเดตนี้ไปยังโปรเจ็กต์ Android Studio แทนที่ ไฟล์กำหนดค่าที่เกี่ยวข้องซึ่งล้าสมัยแล้ว (ดู เพิ่ม Firebase ในโครงการ Android ของคุณ )
หากคุณยังไม่ได้ระบุลายนิ้วมือ SHA ของแอป ให้ระบุจาก หน้าการตั้งค่า ของคอนโซล Firebase ดู การรับรองความถูกต้องไคลเอนต์ของคุณ สำหรับรายละเอียดเกี่ยวกับวิธีรับลายนิ้วมือ SHA ของแอป
หากคุณรองรับการลงชื่อเข้าใช้ด้วย 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) }
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); } } );
หากต้องการเริ่มขั้นตอนการลงชื่อเข้าใช้ 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)
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);
เมื่อขั้นตอนการลงชื่อเข้าใช้เสร็จสมบูรณ์ คุณจะได้รับผลลัพธ์ใน 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. // ... } }
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. // ... } }
ตั้งค่าวิธีการลงชื่อเข้าใช้
การตรวจสอบสิทธิ์ลิงก์อีเมล
ใน คอนโซล Firebase ให้เปิดส่วน การรับรองความถูกต้อง บนแท็บ วิธีการลงชื่อเข้า ใช้ ให้เปิดใช้งานผู้ให้บริการ อีเมล/รหัสผ่าน โปรดทราบว่าต้องเปิดใช้งานการลงชื่อเข้าใช้ด้วยอีเมล/รหัสผ่านเพื่อใช้การลงชื่อเข้าใช้ด้วยลิงก์อีเมล
ในส่วนเดียวกัน ให้เปิดใช้งานวิธีการลงชื่อเข้า ใช้ด้วยลิงก์อีเมล (ลงชื่อเข้าใช้แบบไม่ใช้รหัสผ่าน) แล้วคลิก บันทึก
นอกจากนี้ คุณจะต้องเปิดใช้ลิงก์ไดนามิกของ Firebase เพื่อใช้การลงชื่อเข้าใช้ด้วยลิงก์อีเมล ใน คอนโซล Firebase ให้คลิก ลิงก์ไดนามิก ใต้ ส่วนมีส่วนร่วม ในแถบการนำทาง คลิกที่ เริ่มต้นใช้งาน และเพิ่มโดเมน โดเมนที่คุณเลือกที่นี่จะแสดงในลิงก์อีเมลที่ส่งถึงผู้ใช้ของคุณ
คุณสามารถเปิดใช้งานการลงชื่อเข้าใช้ลิงก์อีเมลใน 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)
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);
หากคุณต้องการรับลิงก์ในกิจกรรมใดกิจกรรมหนึ่ง โปรดทำตามขั้นตอนที่ระบุไว้ ที่นี่ มิฉะนั้น ลิงก์จะเปลี่ยนเส้นทางไปยังกิจกรรมตัวเรียกใช้งานของคุณ
เมื่อคุณพบลิงก์ในรายละเอียดแล้ว คุณจะต้องโทรยืนยันว่าเราสามารถจัดการให้คุณได้ ถ้าทำได้ คุณต้องส่งมาให้เราทาง
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) } }
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); } }
รองรับการลงชื่อเข้าใช้ด้วยลิงก์อีเมลข้ามอุปกรณ์ ซึ่งเป็นตัวเลือก ซึ่งหมายความว่าลิงก์ที่ส่งผ่านแอป Android ของคุณสามารถใช้เพื่อเข้าสู่ระบบบนเว็บหรือแอป Apple ได้ ตามค่าเริ่มต้น จะเปิดใช้งานการสนับสนุนข้ามอุปกรณ์ คุณสามารถปิดใช้งานได้โดยเรียก
setForceSameDevice
บนอินสแตนซ์EmailBuilder
โปรดดูข้อมูลเพิ่มเติมที่ FirebaseUI-Web และ FirebaseUI-iOS
ออกจากระบบ
FirebaseUI มีวิธีอำนวยความสะดวกในการลงชื่อออกจาก Firebase Authentication รวมถึงผู้ให้บริการข้อมูลประจำตัวทางสังคมทั้งหมด:
Kotlin+KTX
AuthUI.getInstance() .signOut(this) .addOnCompleteListener { // ... }
Java
AuthUI.getInstance() .signOut(this) .addOnCompleteListener(new OnCompleteListener<Void>() { public void onComplete(@NonNull Task<Void> task) { // ... } });
คุณยังสามารถลบบัญชีของผู้ใช้ได้ทั้งหมด:
Kotlin+KTX
AuthUI.getInstance() .delete(this) .addOnCompleteListener { // ... }
Java
AuthUI.getInstance() .delete(this) .addOnCompleteListener(new OnCompleteListener<Void>() { @Override public void onComplete(@NonNull Task<Void> task) { // ... } });
การปรับแต่ง
ตามค่าเริ่มต้นแล้ว 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)
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) .setTosAndPrivacyPolicyUrls( "https://example.com/terms.html", "https://example.com/privacy.html", ) .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);
ขั้นตอนถัดไป
- สำหรับข้อมูลเพิ่มเติมเกี่ยวกับการใช้และปรับแต่ง FirebaseUI โปรดดูไฟล์ README บน GitHub
- หากคุณพบปัญหาใน FirebaseUI และต้องการรายงาน ให้ใช้ ตัวติดตามปัญหา GitHub