FirebaseUI是一個建立在 Firebase 驗證 SDK 之上的程式庫，它提供了可在您的應用程式中使用的嵌入式 UI 流。 FirebaseUI 具有以下優點：
- 多個提供者：電子郵件/密碼、電子郵件連結、電話驗證、Google 登入、Facebook 登入和 Twitter 登入的登入流程。
- 帳戶管理：處理帳戶管理任務的流程，例如帳戶建立和密碼重設。
- 匿名帳戶連結：自動將匿名帳戶連結到身分提供者的流程。
- 可自訂：自訂 FirebaseUI 的外觀以符合您的應用程式。此外，由於 FirebaseUI 是開源的，因此您可以分叉專案並根據您的需求進行自訂。
在你開始之前
將 FirebaseUI 新增到您的 Podfile：
pod 'FirebaseUI'如果您願意，可以只新增 Auth 元件和要使用的提供者：
pod 'FirebaseUI/Auth' pod 'FirebaseUI/Google' pod 'FirebaseUI/Facebook' pod 'FirebaseUI/OAuth' # Used for Sign in with Apple, Twitter, etc pod 'FirebaseUI/Phone'如果您尚未將應用程式連線至 Firebase 項目，請從Firebase 控制台執行此操作。
設定登入方法
在使用 Firebase 登入使用者之前，您必須啟用並設定您想要支援的登入方法。
電子郵件地址和密碼
在Firebase 控制台中，開啟「驗證」部分並啟用電子郵件和密碼驗證。
郵件連結驗證
在Firebase 控制台中，開啟「驗證」部分。在登入方法標籤上，啟用電子郵件/密碼提供者。請注意，必須啟用電子郵件/密碼登入才能使用電子郵件連結登入。
在同一部分中，啟用電子郵件連結（無密碼登入）登入方法，然後按一下「儲存」 。
您可以透過使用
FIREmailLinkAuthSignInMethod初始化FUIEmailAuth實例來啟用電子郵件連結登入。您還需要提供一個有效的FIRActionCodeSettings對象，並將handleCodeInApp設為 true。
迅速
var actionCodeSettings = ActionCodeSettings()
actionCodeSettings.url = URL(string: "https://example.appspot.com")
actionCodeSettings.handleCodeInApp = true
actionCodeSettings.setAndroidPackageName("com.firebase.example", installIfNotAvailable: false, minimumVersion: "12")
let provider = FUIEmailAuth(authUI: FUIAuth.defaultAuthUI()!,
signInMethod: FIREmailLinkAuthSignInMethod,
forceSameDevice: false,
allowNewEmailAccounts: true,
actionCodeSetting: actionCodeSettings)
Objective-C
FIRActionCodeSettings *actionCodeSettings = [[FIRActionCodeSettings alloc] init];
actionCodeSettings.URL = [NSURL URLWithString:@"https://example.appspot.com"];
actionCodeSettings.handleCodeInApp = YES;
[actionCodeSettings setAndroidPackageName:@"com.firebase.example"
installIfNotAvailable:NO
minimumVersion:@"12"];
id<FUIAuthProvider> provider = [[FUIEmailAuth alloc] initWithAuthUI:[FUIAuth defaultAuthUI]
signInMethod:FIREmailLinkAuthSignInMethod
forceSameDevice:NO
allowNewEmailAccounts:YES
actionCodeSetting:actionCodeSettings];
此外，您需要將傳遞給初始化程序的 URL 列入白名單。您可以在Firebase 控制台中開啟「身份驗證」部分來執行此操作。在「登入方法」標籤上，在「授權網域」下方新增 URL。
捕獲深層連結後，您需要將其傳遞到身份驗證 UI，以便可以對其進行處理。
迅速
FUIAuth.defaultAuthUI()!.handleOpen(url, sourceApplication: sourceApplication)
Objective-C
[[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];
- FirebaseUI-iOS 中的電子郵件連結登入與FirebaseUI-Android和FirebaseUI-web相容，其中從 FirebaseUI-Android 啟動流程的使用者可以開啟連結並使用 FirebaseUI-web 完成登入。對於相反的流也是如此。
蘋果
請遵循 Firebase使用 Apple 登入指南中的開始之前和遵守 Apple 匿名資料要求部分。
將「使用 Apple 登入」功能新增至您的權利文件。
初始化配置為使用 Apple 登入的 OAuth 提供者實例：
迅速
provider = FUIOAuth.appleAuthProvider()
Objective-C
FUIOAuth *provider = [FUIOAuth appleAuthProvider];
在Firebase 控制台中，開啟「驗證」部分並啟用 Google 登入。
下載專案的
GoogleService-Info.plist檔案的新副本並將其複製到您的 Xcode 專案。用新版本覆蓋任何現有版本。 （請參閱將 Firebase 新增至您的 iOS 專案。）將反向客戶端 ID 新增為 Xcode 專案中的 URL 方案。您可以在
GoogleService-Info.plist檔案中找到該值。
Facebook
依照Facebook 的入門頁面設定 Facebook 登入 SDK。
在Firebase 控制台中，開啟「身份驗證」部分並啟用 Facebook。要啟用 Facebook 登錄，您必須提供 Facebook 應用程式 ID 和應用程式密鑰，您可以在 Facebook 開發者控制台中獲取這些資訊。
從「專案設定」>「功能」畫面在 Xcode 專案中啟用鑰匙圈共用。
在 Xcode 專案中新增
fb FACEBOOK_APP_ID作為 URL 方案。將您的 Facebook 應用程式 ID 和顯示名稱新增至
Info.plist檔案：鑰匙 價值 Facebook應用程式ID FACEBOOK_APP_ID（例如，1234567890）Facebook顯示名稱 您的應用程式的名稱 初始化 Facebook 提供者實例：
迅速
provider = FUIFacebookAuth(authUI: FUIAuth.defaultAuthUI())
Objective-C
FUIFacebookAuth *provider = [[FUIFacebookAuth alloc] initWithAuthUI:[FUIAuth defaultAuthUI]];
如果您想使用Facebook Limited Login ，請在
FUIFacebookAuth實例上設定useLimitedLogin屬性。迅速
provider.useLimitedLogin = true
Objective-C
provider.useLimitedLogin = YES;
推特
在Firebase 控制台中，開啟「驗證」部分並啟用 Twitter。要啟用 Twitter 登錄，您必須提供 Twitter API 使用方金鑰和機密，您可以在 Twitter 應用程式管理控制台中取得這些金鑰和機密。
初始化為 Twitter 登入配置的 OAuth 提供者實例：
迅速
provider = FUIOAuth.twitterAuthProvider()
Objective-C
FUIOAuth *provider = [FUIOAuth twitterAuthProvider];
電話號碼
在Firebase 控制台中，開啟「驗證」部分並啟用電話號碼登入。
Firebase 必須能夠驗證電話號碼登入要求是否來自您的應用程式。實現此目的的方法之一是透過 APNs 通知。有關詳細信息，請參閱啟用應用程式驗證。
若要啟用 APNs 通知以與 Firebase 驗證結合使用：
在 Xcode 中，為您的專案啟用推播通知。
將您的 APNs 驗證金鑰上傳到 Firebase。如果您還沒有 APNs 驗證金鑰，請確保在Apple 開發者會員中心建立一個。
在 Firebase 控制台的項目內，選擇齒輪圖標，選擇項目設置，然後選擇雲端訊息傳遞選項卡。
在iOS 應用程式設定下的APNs 驗證金鑰中，按一下上傳按鈕。
瀏覽到儲存金鑰的位置，選擇它，然後按一下「開啟」 。新增金鑰的金鑰 ID（可在Apple 開發者會員中心取得）並點選Upload 。
如果您已有 APNs 證書，則可以上傳該證書。
當裝置無法接收 APNs 通知時，Firebase 使用 reCAPTCHA 來驗證請求。
若要啟用 reCAPTCHA 驗證，請在 Xcode 中執行下列操作：
- 開啟專案配置：雙擊左側樹視圖中的專案名稱。從“目標”部分選擇您的應用程序，然後選擇“資訊”選項卡，並展開“URL 類型”部分。
- 點擊+按鈕，並將您的編碼應用程式 ID 新增為 URL 方案。您可以在 Firebase 控制台的「常規設定」頁面上的 iOS 應用程式部分中找到您的編碼應用程式 ID。將其他欄位留空。
完成後，您的配置應類似於以下內容（但具有特定於應用程式的值）：
可選：Firebase 使用方法調配來自動獲取您應用的 APNs 令牌，處理 Firebase 發送到您的應用程式的靜默推播通知，並在驗證期間自動攔截來自 reCAPTCHA 驗證頁面的自訂方案重定向。
如果您不想使用 swizzling，請參閱 Firebase SDK 驗證文件中的附錄：使用電話登入而不使用 swizzling 。
登入
若要啟動 FirebaseUI 登入流程，首先初始化 FirebaseUI：
迅速
import FirebaseAuthUI
/* ... */
FirebaseApp.configure()
let authUI = FUIAuth.defaultAuthUI()
// You need to adopt a FUIAuthDelegate protocol to receive callback
authUI.delegate = self
Objective-C
@import FirebaseAuthUI;
...
[FIRApp configure];
FUIAuth *authUI = [FUIAuth defaultAuthUI];
// You need to adopt a FUIAuthDelegate protocol to receive callback
authUI.delegate = self;
然後，配置 FirebaseUI 以使用您想要支援的登入方法：
迅速
import FirebaseAuthUI
import FirebaseFacebookAuthUI
import FirebaseGoogleAuthUI
import FirebaseOAuthUI
import FirebasePhoneAuthUI
let providers: [FUIAuthProvider] = [
FUIGoogleAuth(),
FUIFacebookAuth(),
FUITwitterAuth(),
FUIPhoneAuth(authUI:FUIAuth.defaultAuthUI()),
]
self.authUI.providers = providers
Objective-C
@import FirebaseAuthUI;
@import FirebaseFacebookAuthUI;
@import FirebaseGoogleAuthUI;
@import FirebaseOAuthUI;
@import FirebasePhoneAuthUI;
...
NSArray<id<FUIAuthProvider>> *providers = @[
[[FUIGoogleAuth alloc] init],
[[FUIFacebookAuth alloc] init],
[[FUITwitterAuth alloc] init],
[[FUIPhoneAuth alloc] initWithAuthUI:[FUIAuth defaultAuthUI]]
];
_authUI.providers = providers;
如果您啟用了 Google 或 Facebook 登錄，請為 Google 和 Facebook 註冊流程的結果實現處理程序：
迅速
func application(_ app: UIApplication, open url: URL,
options: [UIApplicationOpenURLOptionsKey : Any]) -> Bool {
let sourceApplication = options[UIApplicationOpenURLOptionsKey.sourceApplication] as! String?
if FUIAuth.defaultAuthUI()?.handleOpen(url, sourceApplication: sourceApplication) ?? false {
return true
}
// other URL handling goes here.
return false
}
Objective-C
- (BOOL)application:(UIApplication *)app
openURL:(NSURL *)url
options:(NSDictionary *)options {
NSString *sourceApplication = options[UIApplicationOpenURLOptionsSourceApplicationKey];
return [[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];
}
最後，從FUIAuth取得AuthViewController的實例。然後，您可以將其呈現為應用程式的第一個視圖控制器，也可以從應用程式中的另一個視圖控制器呈現它。
迅速
若要取得登入方法選擇器：
let authViewController = authUI.authViewController()
如果您僅使用電話號碼登錄，則可以直接顯示電話號碼登入檢視：
let phoneProvider = FUIAuth.defaultAuthUI().providers.first as! FUIPhoneAuth
phoneProvider.signIn(withPresenting: currentlyVisibleController, phoneNumber: nil)
Objective-C
若要取得登入方法選擇器：
UINavigationController *authViewController = [authUI authViewController];
如果您僅使用電話號碼登錄，則可以直接顯示電話號碼登入檢視：
FUIPhoneAuth *phoneProvider = [FUIAuth defaultAuthUI].providers.firstObject;
[phoneProvider signInWithPresentingViewController:currentlyVisibleController phoneNumber:nil];
呈現身份驗證檢視且使用者登入後，結果將會回到didSignInWithUser:error:方法中的 FirebaseUI Auth 委託：
迅速
func authUI(_ authUI: FUIAuth, didSignInWith user: FIRUser?, error: Error?) {
// handle user and error as necessary
}
Objective-C
- (void)authUI:(FUIAuth *)authUI
didSignInWithUser:(nullable FIRUser *)user
error:(nullable NSError *)error {
// Implement this method to handle signed in user or error if any.
}
登出
FirebaseUI 提供了註銷 Firebase 身份驗證以及所有社交身分提供者的便利方法：
迅速
authUI.signOut()
Objective-C
[authUI signOut];
客製化
您可以透過子類化 FirebaseUI 的視圖控制器並在FUIAuth的委託方法中指定它們來自訂登入畫面：
迅速
func authPickerViewController(forAuthUI authUI: FUIAuth) -> FUIAuthPickerViewController {
return FUICustomAuthPickerViewController(nibName: "FUICustomAuthPickerViewController",
bundle: Bundle.main,
authUI: authUI)
}
func emailEntryViewController(forAuthUI authUI: FUIAuth) -> FUIEmailEntryViewController {
return FUICustomEmailEntryViewController(nibName: "FUICustomEmailEntryViewController",
bundle: Bundle.main,
authUI: authUI)
}
func passwordRecoveryViewController(forAuthUI authUI: FUIAuth, email: String) -> FUIPasswordRecoveryViewController {
return FUICustomPasswordRecoveryViewController(nibName: "FUICustomPasswordRecoveryViewController",
bundle: Bundle.main,
authUI: authUI,
email: email)
}
func passwordSignInViewController(forAuthUI authUI: FUIAuth, email: String) -> FUIPasswordSignInViewController {
return FUICustomPasswordSignInViewController(nibName: "FUICustomPasswordSignInViewController",
bundle: Bundle.main,
authUI: authUI,
email: email)
}
func passwordSignUpViewController(forAuthUI authUI: FUIAuth, email: String) -> FUIPasswordSignUpViewController {
return FUICustomPasswordSignUpViewController(nibName: "FUICustomPasswordSignUpViewController",
bundle: Bundle.main,
authUI: authUI,
email: email)
}
func passwordVerificationViewController(forAuthUI authUI: FUIAuth, email: String, newCredential: AuthCredential) -> FUIPasswordVerificationViewController {
return FUICustomPasswordVerificationViewController(nibName: "FUICustomPasswordVerificationViewController",
bundle: Bundle.main,
authUI: authUI,
email: email,
newCredential: newCredential)
}
Objective-C
- (FUIAuthPickerViewController *)authPickerViewControllerForAuthUI:(FUIAuth *)authUI {
return [[FUICustomAuthPickerViewController alloc] initWithNibName:@"FUICustomAuthPickerViewController"
bundle:[NSBundle mainBundle]
authUI:authUI];
}
- (FUIEmailEntryViewController *)emailEntryViewControllerForAuthUI:(FUIAuth *)authUI {
return [[FUICustomEmailEntryViewController alloc] initWithNibName:@"FUICustomEmailEntryViewController"
bundle:[NSBundle mainBundle]
authUI:authUI];
}
- (FUIPasswordSignInViewController *)passwordSignInViewControllerForAuthUI:(FUIAuth *)authUI
email:(NSString *)email {
return [[FUICustomPasswordSignInViewController alloc] initWithNibName:@"FUICustomPasswordSignInViewController"
bundle:[NSBundle mainBundle]
authUI:authUI
email:email];
}
- (FUIPasswordSignUpViewController *)passwordSignUpViewControllerForAuthUI:(FUIAuth *)authUI
email:(NSString *)email {
return [[FUICustomPasswordSignUpViewController alloc] initWithNibName:@"FUICustomPasswordSignUpViewController"
bundle:[NSBundle mainBundle]
authUI:authUI
email:email];
}
- (FUIPasswordRecoveryViewController *)passwordRecoveryViewControllerForAuthUI:(FUIAuth *)authUI
email:(NSString *)email {
return [[FUICustomPasswordRecoveryViewController alloc] initWithNibName:@"FUICustomPasswordRecoveryViewController"
bundle:[NSBundle mainBundle]
authUI:authUI
email:email];
}
- (FUIPasswordVerificationViewController *)passwordVerificationViewControllerForAuthUI:(FUIAuth *)authUI
email:(NSString *)email
newCredential:(FIRAuthCredential *)newCredential {
return [[FUICustomPasswordVerificationViewController alloc] initWithNibName:@"FUICustomPasswordVerificationViewController"
bundle:[NSBundle mainBundle]
authUI:authUI
email:email
newCredential:newCredential];
}
您可以自訂應用程式服務條款的 URL，該連結位於帳戶建立畫面：
迅速
let kFirebaseTermsOfService = URL(string: "https://example.com/terms")!
authUI.tosurl = kFirebaseTermsOfService
Objective-C
authUI.TOSURL = [NSURL URLWithString:@"https://example.com/terms"];
最後，您可以透過指定自訂捆綁包來自訂向使用者顯示的訊息和提示：
迅速
authUI.customStringsBundle = NSBundle.mainBundle() // Or any custom bundle.
Objective-C
authUI.customStringsBundle = [NSBundle mainBundle]; // Or any custom bundle.
下一步
- 有關使用和自訂 FirebaseUI 的更多信息，請參閱 GitHub 上的自述文件。
- 如果您在 FirebaseUI 中發現並出現問題並想要回報該問題，請使用GitHub 問題追蹤器。