Dễ dàng thêm đăng nhập vào ứng dụng Android của bạn với FirebaseUI

FirebaseUI là thư viện được xây dựng dựa trên SDK xác thực Firebase cung cấp các luồng giao diện người dùng tùy chọn để sử dụng trong ứng dụng của bạn. FirebaseUI cung cấp các lợi ích sau:

  • Nhiều nhà cung cấp - luồng đăng nhập cho email/mật khẩu, liên kết email, xác thực điện thoại, Đăng nhập bằng Google, Đăng nhập Facebook, Đăng nhập Twitter và Đăng nhập GitHub.
  • Quản lý tài khoản - các luồng xử lý các tác vụ quản lý tài khoản, chẳng hạn như tạo tài khoản và đặt lại mật khẩu.
  • Liên kết tài khoản - luồng để liên kết tài khoản người dùng một cách an toàn giữa các nhà cung cấp danh tính.
  • Nâng cấp người dùng ẩn danh - hướng tới nâng cấp người dùng ẩn danh một cách an toàn.
  • Chủ đề tùy chỉnh - tùy chỉnh giao diện của FirebaseUI để phù hợp với ứng dụng của bạn. Ngoài ra, vì FirebaseUI là nguồn mở nên bạn có thể phân nhánh dự án và tùy chỉnh dự án một cách chính xác theo nhu cầu của mình.
  • Khóa thông minh cho mật khẩu - tích hợp tự động với Smart Lock cho mật khẩu để đăng nhập nhanh trên nhiều thiết bị.

Trước khi bắt đầu

  1. Nếu bạn chưa có, hãy thêm Firebase vào dự án Android của bạn .

  2. Thêm phần phụ thuộc cho FirebaseUI vào tệp build.gradle cấp ứng dụng của bạn. Nếu bạn muốn hỗ trợ đăng nhập bằng Facebook hoặc Twitter, hãy bao gồm SDK Facebook và 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 xác thực FirebaseUI có các phần phụ thuộc bắc cầu trên SDK Firebase và SDK dịch vụ Google Play.

  3. Trong bảng điều khiển Firebase , hãy mở phần Xác thực và bật các phương thức đăng nhập mà bạn muốn hỗ trợ. Một số phương thức đăng nhập yêu cầu thông tin bổ sung, thường có sẵn trong bảng điều khiển dành cho nhà phát triển của dịch vụ.

  4. Nếu bạn đã bật Đăng nhập bằng Google:

    1. Khi được nhắc trong bảng điều khiển, hãy tải xuống tệp cấu hình Firebase đã cập nhật ( google-services.json ), tệp này hiện chứa thông tin ứng dụng khách OAuth cần thiết để đăng nhập vào Google.

    2. Di chuyển tệp cấu hình đã cập nhật này vào dự án Android Studio của bạn, thay thế tệp cấu hình tương ứng hiện đã lỗi thời. (Xem Thêm Firebase vào dự án Android của bạn .)

    3. Nếu bạn chưa chỉ định dấu vân tay SHA cho ứng dụng của mình, hãy làm như vậy từ trang Cài đặt của bảng điều khiển Firebase. Xem Xác thực ứng dụng khách của bạn để biết chi tiết về cách lấy dấu vân tay SHA của ứng dụng.

  5. Nếu bạn hỗ trợ đăng nhập bằng Facebook hoặc Twitter, hãy thêm tài nguyên chuỗi vào strings.xml để chỉ định thông tin nhận dạng mà mỗi nhà cung cấp yêu cầu:

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

Đăng nhập

Tạo một ActivityResultLauncher đăng ký một lệnh gọi lại cho hợp đồng kết quả Hoạt động 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);
            }
        }
);

Để bắt đầu luồng đăng nhập FirebaseUI, hãy tạo ý định đăng nhập bằng các phương thức đăng nhập ưa thích của bạn:

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

Khi luồng đăng nhập hoàn tất, bạn sẽ nhận được kết quả trong 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.
        // ...
    }
}

Thiết lập phương thức đăng nhập

  1. Trong bảng điều khiển Firebase , hãy mở phần Xác thực . Trên tab Phương thức đăng nhập , bật nhà cung cấp Email/Mật khẩu . Lưu ý rằng tính năng đăng nhập bằng email/mật khẩu phải được bật để sử dụng tính năng đăng nhập bằng liên kết email.

  2. Trong cùng phần này, bật phương thức đăng nhập liên kết Email (đăng nhập không cần mật khẩu) và nhấp vào Lưu .

  3. Bạn cũng sẽ phải bật Liên kết động Firebase để sử dụng đăng nhập bằng liên kết email. Trong bảng điều khiển Firebase , hãy nhấp vào Liên kết động bên dưới Tương tác trên thanh điều hướng. Nhấp vào Bắt đầu và thêm miền. Tên miền bạn chọn ở đây sẽ được phản ánh trong các liên kết email được gửi tới người dùng của bạn.

  4. Bạn có thể kích hoạt đăng nhập liên kết email trong FirebaseUI bằng cách gọi enableEmailLinkSignIn trên phiên bản EmailBuilder . Bạn cũng sẽ cần cung cấp một đối tượng ActionCodeSettings hợp lệ với setHandleCodeInApp được đặt thành true. Ngoài ra, bạn cần đưa URL bạn chuyển tới setUrl vào danh sách trắng, việc này có thể được thực hiện trong bảng điều khiển Firebase , trong Xác thực -> Phương thức đăng nhập -> Miền được ủy quyền.

    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);
  5. Nếu bạn muốn nắm bắt liên kết trong một hoạt động cụ thể, vui lòng làm theo các bước được nêu ở đây . Nếu không, liên kết sẽ chuyển hướng đến hoạt động trình khởi chạy của bạn.

  6. Khi bạn nắm bắt được liên kết sâu, bạn sẽ cần gọi điện để xác minh rằng chúng tôi có thể xử lý nó cho bạn. Nếu có thể, bạn cần chuyển nó cho chúng tôi qua 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);
        }
    }
  7. Đăng nhập liên kết email trên nhiều thiết bị tùy chọn được hỗ trợ, điều đó có nghĩa là liên kết được gửi qua ứng dụng Android của bạn có thể được sử dụng để đăng nhập trên web hoặc ứng dụng Apple của bạn. Theo mặc định, hỗ trợ thiết bị chéo được bật. Bạn có thể vô hiệu hóa nó bằng cách gọi setForceSameDevice trên phiên bản EmailBuilder .

    Xem FirebaseUI-WebFirebaseUI-iOS để biết thêm thông tin.

Đăng xuất

FirebaseUI cung cấp các phương thức tiện lợi để đăng xuất khỏi Xác thực Firebase cũng như tất cả các nhà cung cấp danh tính xã hội:

Kotlin+KTX

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

Java

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

Bạn cũng có thể xóa hoàn toàn tài khoản của người dùng:

Kotlin+KTX

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

Java

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

Tùy chỉnh

Theo mặc định, FirebaseUI sử dụng AppCompat để tạo chủ đề, điều đó có nghĩa là nó sẽ áp dụng bảng màu của ứng dụng của bạn một cách tự nhiên. Nếu cần tùy chỉnh thêm, bạn có thể chuyển chủ đề và biểu tượng cho trình tạo Intent đăng nhập:

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

Bạn cũng có thể đặt chính sách quyền riêng tư và điều khoản dịch vụ tùy chỉnh:

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

Bước tiếp theo

  • Để biết thêm thông tin về cách sử dụng và tùy chỉnh FirebaseUI, hãy xem tệp README trên GitHub.
  • Nếu bạn phát hiện thấy sự cố trong FirebaseUI và muốn báo cáo sự cố đó, hãy sử dụng trình theo dõi sự cố GitHub .