本頁面由 Cloud Translation API 翻譯而成。

透過 FirebaseUI 輕鬆將登入程序新增至 iOS 應用程式

FirebaseUI 是一個建構程式庫 Firebase Authentication SDK 上方提供了直接的 UI 流程。FirebaseUI 具備下列優點：

多個供應商：電子郵件/密碼、電子郵件連結、電話的登入流程驗證、Google 登入、Facebook 登入和 Twitter 登入。
帳戶管理：處理帳戶管理工作的流程，例如建立帳戶及重設密碼。
匿名帳戶連結：自動連結匿名帳戶流程連線至識別資訊提供者
可自訂：配合應用程式自訂 FirebaseUI 的外觀。另外，因為 FirebaseUI 是開放原始碼符合您的需求

事前準備

注意：Firebase 同時支援 CocoaPods 和 Swift 套件管理工具。如果選擇在 Firebase 中使用 Swift Package Manager 時，您可以略過 CocoaPods 相關步驟，例如修改 Podfiles 並執行 pod 指令。

將 Firebase 新增至 Apple 專案。

將 FirebaseUI 新增至 Podfile：

pod 'FirebaseUI'

如有需要，您可以只新增驗證元件和供應商或是使用：

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 控制台中開啟「驗證」專區。每月中的特定幾天「Sign in method」分頁，啟用「Email/Password」供應商。注意事項您必須啟用電子郵件或密碼登入功能，才能使用電子郵件連結登入。
在同一部分中啟用「電子郵件連結 (無密碼登入)」登入功能方法並點選「儲存」。
如要啟用電子郵件連結登入功能，請初始化 FUIEmailAuth 含有 FIREmailLinkAuthSignInMethod 的執行個體此外，您也必須提供有效的 FIRActionCodeSettings 物件，其中 handleCodeInApp 設為 true。

Swift

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

此外，請將傳遞至 iniatializer 的網址加入許可清單。您可以在 Firebase 控制台中開啟「驗證」。專區。在「Sign in method」分頁中，將網址新增至 授權網域：
擷取深層連結後，您必須將其傳遞至驗證 UI 可以處理

Swift

FUIAuth.defaultAuthUI()!.handleOpen(url, sourceApplication: sourceApplication)

Objective-C

[[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];

FirebaseUI-iOS 的電子郵件連結登入功能與 FirebaseUI-Android 版和 FirebaseUI 網站在 FirebaseUI-Android 啟動流程的使用者可開啟連結並透過 FirebaseUI-web 完成登入。相反地流程

Apple

遵循事前準備和參考 Apple 匿名資料相關規定 Firebase 的「使用 Apple 帳戶登入」指南。
在授權檔案中加入「使用 Apple 帳戶登入」功能。

初始化為「使用 Apple 登入」設定的 OAuth 提供者執行個體：

Swift

provider = FUIOAuth.appleAuthProvider()

Objective-C

FUIOAuth *provider = [FUIOAuth appleAuthProvider];

Google

使用此教學課程設定 Google 登入功能

Facebook

請按照下列步驟設定 Facebook Login SDK Facebook 的開始使用頁面。
在 Firebase 控制台中開啟「驗證」部分，然後啟用 Facebook。如要啟用 Facebook 登入功能，您必須提供 Facebook 應用程式 ID 您可以前往 Facebook 開發人員主控台取得「應用程式密鑰」和「應用程式密鑰」
前往 [專案設定] > [在 Xcode 專案中啟用鑰匙圈共用] 功能，請前往 [專案設定] > 功能螢幕。
將 fbFACEBOOK_APP_ID 新增為網址配置 Xcode 專案
在 Info.plist 檔案中新增 Facebook 應用程式 ID 和顯示名稱：

鍵值

Facebook 應用程式 ID FACEBOOK_APP_ID (例如：1234567890)

Facebook 顯示名稱應用程式名稱

鍵	值
Facebook 應用程式 ID	`FACEBOOK_APP_ID` (例如：`1234567890`)
Facebook 顯示名稱	應用程式名稱

初始化 Facebook 提供者執行個體：

Swift

provider = FUIFacebookAuth(authUI: FUIAuth.defaultAuthUI())

Objective-C

FUIFacebookAuth *provider = [[FUIFacebookAuth alloc] initWithAuthUI:[FUIAuth defaultAuthUI]];

如要使用 Facebook Limited Login，設定 FUIFacebookAuth 執行個體上的 useLimitedLogin 屬性。
Swift
```
provider.useLimitedLogin = true
```
Objective-C
```
provider.useLimitedLogin = YES;
```

Twitter

在 Firebase 控制台中開啟「驗證」部分，然後啟用 Twitter。如要啟用 Twitter 登入功能，您必須提供 Twitter API 用戶端金鑰和密鑰：您可以在 Twitter 應用程式中取得。管理控制台。

初始化為 Twitter 登入設定的 OAuth 提供者執行個體：

Swift

provider = FUIOAuth.twitterAuthProvider()

Objective-C

FUIOAuth *provider = [FUIOAuth twitterAuthProvider];

電話號碼

在 Firebase 控制台中開啟「驗證」部分，然後啟用電話號碼登入。
Firebase 必須能驗證電話號碼登入要求找出來自您的應用程式的流量可藉助 APNs 達成通知。詳情請見啟用應用程式驗證功能。

如何啟用 APN 通知以便與 Firebase Authentication 搭配使用：
1. 在 Xcode 中啟用推播通知。
2. 將 APN 驗證金鑰上傳至 Firebase。如果您還沒有 APN 驗證金鑰，請務必前往 Apple Developer Member Center：
  1. 在 Firebase 控制台的專案中，選取齒輪圖示，選取「Project Settings」，然後選取「雲端通訊」分頁。
  2. 在「iOS 應用程式設定」下方的「APNs 驗證金鑰」中，按一下「上傳」圖示按鈕。
  3. 瀏覽至儲存金鑰的位置並選取金鑰，然後按一下開啟。加入金鑰的金鑰 ID (位於 Apple Developer Member Center 時，按一下按一下「上傳」。
  如果您已有 APN 憑證，則可上傳憑證。
如果無法在裝置上接收 APN 通知，Firebase 會使用 reCAPTCHA 驗證要求。

如要啟用 reCAPTCHA 驗證，請在 Xcode 中執行下列步驟：
1. 開啟專案設定：按兩下左側樹狀檢視中從「目標」部分中選取應用程式，然後選取「資訊」分頁標籤，然後展開「網址類型」部分。
2. 點選「+」按鈕，然後將經過編碼的應用程式 ID 新增為網址配置。如要找到經過編碼的應用程式 ID，請前往一般 Firebase 控制台的「設定」頁面，位於 iOS 裝置的專區應用程式。將其他欄位留白。
  設定完成後，設定看起來應該會與後面 (但採用您應用程式的專屬值)：
選用：Firebase 會使用方法掃描功能，自動取得應用程式的 APN 權杖，用於處理 Firebase 的無訊息推播通知並自動攔截自訂配置重新導向驗證應用程式時，請點選 reCAPTCHA 驗證頁面中的註解。

如果不想使用擦拭功能，請參閱「附錄：在不移位的情況下使用手機登入」。

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 註冊流程：

Swift

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 的例項。接著顯示為應用程式的第一個檢視畫面應用程式中的另一個檢視控制器。

Swift

如何取得登入方式選取器：

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 驗證委派項目方法：

Swift

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 驗證的便利方法以及所有社交身分提供者：

Swift

authUI.signOut()

Objective-C

[authUI signOut];

自訂

您可以將 FirebaseUI 的檢視畫面建立子類別，以自訂登入畫面控制器並透過 FUIAuth 的委派方法指定這些控制器：

Swift

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

您可以自訂應用程式服務條款的網址，這個連結位於帳戶建立畫面：

Swift

let kFirebaseTermsOfService = URL(string: "https://example.com/terms")!
authUI.tosurl = kFirebaseTermsOfService

Objective-C

authUI.TOSURL = [NSURL URLWithString:@"https://example.com/terms"];

最後，您可以自訂要向使用者顯示的訊息和提示，方法如下：指定自訂軟體包：

Swift

authUI.customStringsBundle = NSBundle.mainBundle() // Or any custom bundle.

Objective-C

authUI.customStringsBundle = [NSBundle mainBundle]; // Or any custom bundle.

後續步驟

如要進一步瞭解如何使用及自訂 FirebaseUI，請參閱讀我資訊
如果您在 FirebaseUI 中發現問題並想回報，請使用 GitHub 問題追蹤工具。