FirebaseUI — это библиотека, построенная на основе SDK Firebase Authentication, которая предоставляет встраиваемые потоки пользовательского интерфейса для использования в вашем приложении. FirebaseUI предоставляет следующие преимущества:
- Несколько поставщиков : потоки входа для электронной почты/пароля, ссылки электронной почты, проверки подлинности телефона, входа в Google, входа в Facebook и входа в Twitter.
- Управление учетными записями : потоки для выполнения задач управления учетными записями, таких как создание учетной записи и сброс пароля.
- Связывание анонимных учетных записей : потоки для автоматической привязки анонимных учетных записей к поставщикам удостоверений.
- Настраиваемый : настройте внешний вид FirebaseUI в соответствии с вашим приложением. Кроме того, поскольку FirebaseUI имеет открытый исходный код, вы можете разветвить проект и настроить его точно под свои нужды.
Прежде чем вы начнете
Добавьте FirebaseUI в свой подфайл:
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 откройте раздел Аутентификация . На вкладке «Метод входа» включите поставщика электронной почты/пароля . Обратите внимание, что для входа по электронной почте необходимо включить вход по электронной почте/паролю.
В том же разделе включите метод входа по ссылке «Электронная почта» (вход без пароля) и нажмите «Сохранить» .
Вы можете включить вход по ссылке электронной почты, инициализировав экземпляр
FUIEmailAuthс помощьюFIREmailLinkAuthSignInMethod. Вам также потребуется предоставить допустимый объект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)
Цель-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-адрес в разделе Авторизованные домены .
Как только вы поймаете глубокую ссылку, вам нужно будет передать ее пользовательскому интерфейсу аутентификации, чтобы ее можно было обработать.
Быстрый
FUIAuth.defaultAuthUI()!.handleOpen(url, sourceApplication: sourceApplication)
Цель-C
[[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];
- Вход по ссылке электронной почты в FirebaseUI-iOS совместим с FirebaseUI-Android и FirebaseUI-web , где один пользователь, запускающий поток из FirebaseUI-Android, может открыть ссылку и завершить вход с помощью FirebaseUI-web. То же самое верно и для противоположного потока.
Яблоко
Следуйте разделам « Перед началом работы» и «Соответствие требованиям Apple к анонимным данным» в руководстве Firebase «Войти с помощью Apple» .
Добавьте возможность входа с помощью Apple в свой файл прав.
Инициализируйте экземпляр поставщика OAuth, настроенный для входа с помощью Apple:
Быстрый
provider = FUIOAuth.appleAuthProvider()
Цель-C
FUIOAuth *provider = [FUIOAuth appleAuthProvider];
В консоли Firebase откройте раздел «Аутентификация» и включите вход через Google.
Загрузите новую копию файла
GoogleService-Info.plistвашего проекта и скопируйте его в свой проект Xcode. Замените существующие версии новыми. (См. раздел Добавление Firebase в проект iOS .)Добавьте свой обратный идентификатор клиента в качестве схемы URL-адреса в свой проект Xcode. Это значение можно найти в файле
GoogleService-Info.plist.
Фейсбук
Настройте SDK для входа в Facebook, перейдя на начальную страницу Facebook .
В консоли Firebase откройте раздел Аутентификация и включите Facebook. Чтобы включить вход через Facebook, вы должны указать свой идентификатор приложения Facebook и секрет приложения, которые вы можете получить в консоли разработчиков Facebook.
Включите общий доступ к связке ключей в вашем проекте Xcode на экране «Настройки проекта» > «Возможности» .
Добавьте
fb FACEBOOK_APP_IDв качестве схемы URL в свой проект Xcode.Добавьте свой идентификатор приложения Facebook и отображаемое имя в файл
Info.plist:Ключ Ценить FacebookAppID FACEBOOK_APP_ID(например,1234567890)FacebookDisplayName Название вашего приложения Инициализируйте экземпляр провайдера Facebook:
Быстрый
provider = FUIFacebookAuth(authUI: FUIAuth.defaultAuthUI())
Цель-C
FUIFacebookAuth *provider = [[FUIFacebookAuth alloc] initWithAuthUI:[FUIAuth defaultAuthUI]];
Если вы хотите использовать ограниченный вход через Facebook , установите свойство
useLimitedLoginв экземпляреFUIFacebookAuth.Быстрый
provider.useLimitedLogin = true
Цель-C
provider.useLimitedLogin = YES;
Твиттер
В консоли Firebase откройте раздел Аутентификация и включите Twitter. Чтобы разрешить вход в Твиттер, вы должны указать свой потребительский ключ и секрет API Твиттера, которые вы можете получить в консоли управления приложениями Твиттера.
Инициализируйте экземпляр поставщика OAuth, настроенный для входа в Twitter:
Быстрый
provider = FUIOAuth.twitterAuthProvider()
Цель-C
FUIOAuth *provider = [FUIOAuth twitterAuthProvider];
Номер телефона
В консоли Firebase откройте раздел «Аутентификация» и включите вход по номеру телефона.
Firebase должен иметь возможность проверять, что запросы на вход по номеру телефона поступают из вашего приложения. Один из способов добиться этого — через уведомления APN. Дополнительные сведения см. в разделе Включение проверки приложений .
Чтобы включить уведомления APN для использования с аутентификацией Firebase:
В Xcode включите push-уведомления для вашего проекта.
Загрузите свой ключ аутентификации APNs в Firebase. Если у вас еще нет ключа аутентификации APN, обязательно создайте его в Apple Developer Member Center .
Внутри вашего проекта в консоли Firebase щелкните значок шестеренки, выберите «Настройки проекта» , а затем выберите вкладку «Облачные сообщения» .
В разделе «Ключ аутентификации APNs» в разделе «Конфигурация приложения iOS» нажмите кнопку «Загрузить» .
Перейдите к месту, где вы сохранили свой ключ, выберите его и нажмите «Открыть» . Добавьте идентификатор ключа для ключа (доступен в Apple Developer Member Center ) и нажмите «Загрузить» .
Если у вас уже есть сертификат APNs, вы можете вместо этого загрузить сертификат.
Когда уведомления APN не могут быть получены на устройстве, Firebase использует reCAPTCHA для проверки запросов.
Чтобы включить проверку reCAPTCHA, сделайте в Xcode следующее:
- Откройте конфигурацию вашего проекта: дважды щелкните имя проекта в левом древовидном представлении. Выберите свое приложение в разделе ЦЕЛИ , затем перейдите на вкладку Информация и разверните раздел Типы URL .
- Нажмите кнопку + и добавьте свой закодированный идентификатор приложения в качестве схемы URL. Вы можете найти свой закодированный идентификатор приложения на странице общих настроек консоли Firebase в разделе вашего приложения для iOS. Остальные поля оставьте пустыми.
По завершении ваша конфигурация должна выглядеть примерно так (но со значениями, специфичными для вашего приложения):
Необязательно : Firebase использует метод swizzling для автоматического получения токена APN вашего приложения, для обработки автоматических push-уведомлений, которые Firebase отправляет вашему приложению, и для автоматического перехвата пользовательской схемы перенаправления со страницы проверки reCAPTCHA во время проверки.
Если вы предпочитаете не использовать swizzling, см. Приложение: Использование входа с помощью телефона без swizzling в документах по аутентификации Firebase SDK.
Войти
Чтобы запустить процесс входа в FirebaseUI, сначала инициализируйте FirebaseUI:
Быстрый
import FirebaseAuthUI
/* ... */
FirebaseApp.configure()
let authUI = FUIAuth.defaultAuthUI()
// You need to adopt a FUIAuthDelegate protocol to receive callback
authUI.delegate = self
Цель-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
Цель-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
}
Цель-C
- (BOOL)application:(UIApplication *)app
openURL:(NSURL *)url
options:(NSDictionary *)options {
NSString *sourceApplication = options[UIApplicationOpenURLOptionsSourceApplicationKey];
return [[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];
}
Наконец, получите экземпляр AuthViewController из FUIAuth . Затем вы можете либо представить его как первый контроллер представления вашего приложения, либо представить его из другого контроллера представления в вашем приложении.
Быстрый
Чтобы получить селектор метода входа:
let authViewController = authUI.authViewController()
Если вы используете только вход по номеру телефона, вместо этого вы можете напрямую отобразить представление входа по номеру телефона:
let phoneProvider = FUIAuth.defaultAuthUI().providers.first as! FUIPhoneAuth
phoneProvider.signIn(withPresenting: currentlyVisibleController, phoneNumber: nil)
Цель-C
Чтобы получить селектор метода входа:
UINavigationController *authViewController = [authUI authViewController];
Если вы используете только вход по номеру телефона, вместо этого вы можете напрямую отобразить представление входа по номеру телефона:
FUIPhoneAuth *phoneProvider = [FUIAuth defaultAuthUI].providers.firstObject;
[phoneProvider signInWithPresentingViewController:currentlyVisibleController phoneNumber:nil];
После того, как вы представите представление аутентификации и пользователь войдет в систему, результат будет возвращен делегату аутентификации FirebaseUI в методе didSignInWithUser:error: ::
Быстрый
func authUI(_ authUI: FUIAuth, didSignInWith user: FIRUser?, error: Error?) {
// handle user and error as necessary
}
Цель-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 Authentication, а также из всех поставщиков социальных сетей:
Быстрый
authUI.signOut()
Цель-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)
}
Цель-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
Цель-C
authUI.TOSURL = [NSURL URLWithString:@"https://example.com/terms"];
Наконец, вы можете настроить сообщения и подсказки, отображаемые вашим пользователям, указав пользовательский пакет:
Быстрый
authUI.customStringsBundle = NSBundle.mainBundle() // Or any custom bundle.
Цель-C
authUI.customStringsBundle = [NSBundle mainBundle]; // Or any custom bundle.
Следующие шаги
- Дополнительные сведения об использовании и настройке FirebaseUI см. в файле README на GitHub.
- Если вы нашли проблему в FirebaseUI и хотите сообщить об этом, используйте трекер ошибок GitHub .