Join us for Firebase Summit on November 10, 2021. Tune in to learn how Firebase can help you accelerate app development, release with confidence, and scale with ease. Register

FirebaseUI ile iOS uygulamanıza kolayca oturum açma özelliğini ekleyin

FirebaseUI açılan UI uygulamanızda kullanmak için akar sağlar Firebase Kimlik SDK üzerine inşa kütüphanesidir. FirebaseUI aşağıdaki avantajları sağlar:

  • Çoklu sağlayıcıları: oturum açma e-posta / şifre, e-posta bağlantısı, telefon doğrulaması Google Oturum Açma, Facebook Login ve Twitter Giriş için akışları.
  • Hesap yönetimi: Böyle bir hesap oluşturma ve şifre sıfırlar gibi hesap yönetimi görevlerini işlemek için akar.
  • Bağlama Anonim hesabı: otomatik kimlik sağlayıcılarına anonim hesapları bağlamak için akar.
  • Kişiselleştirilebilir: Uygulamanızı maç için FirebaseUI görünümünü özelleştirmek. Ayrıca, FirebaseUI açık kaynak olduğu için projeyi çatallayabilir ve tam olarak ihtiyaçlarınıza göre özelleştirebilirsiniz.

Sen başlamadan önce

  1. İOS projeye Firebase ekleyin .

  2. Pod dosyanıza FirebaseUI ekleyin:

    pod 'FirebaseUI'

    İsterseniz yalnızca Auth bileşenini ve kullanmak istediğiniz sağlayıcıları ekleyebilirsiniz:

    pod 'FirebaseUI/Auth'

pod 'FirebaseUI/Google'
pod 'FirebaseUI/Facebook'
pod 'FirebaseUI/OAuth' # Used for Sign in with Apple, Twitter, etc
pod 'FirebaseUI/Phone'

  3. Henüz Firebase projesine uygulamanızı bağlı değil varsa, gelen bunu Firebase konsoluna .

Oturum açma yöntemlerini ayarlayın

Kullanıcıların oturum açması için Firebase'i kullanmadan önce, desteklemek istediğiniz oturum açma yöntemlerini etkinleştirmeniz ve yapılandırmanız gerekir.

E-posta adresi ve şifre

In Firebase konsoluna , Kimlik Doğrulama bölümünü açmak ve e-posta ve şifre kimlik doğrulamasını etkinleştirmek.

  1. In Firebase konsoluna , Kimlik Doğrulama bölümünü açın. Yöntem sekmesinde İşaret Üzerine, E-posta / Şifre sağlayıcı sağlar. E-posta bağlantısı oturum açmayı kullanmak için e-posta/şifre oturum açmanın etkinleştirilmesi gerektiğini unutmayın.

  2. Aynı bölümde, yöntemde oturum açma E-posta bağlantısını (şifresiz oturum açma) etkinleştirmek ve Kaydet'i tıklayın.

  3. Bir başlatarak e-posta bağlantı işaretini etkinleştirebilirsiniz FUIEmailAuth ile örneğini FIREmailLinkAuthSignInMethod . Ayrıca geçerli bir vermeniz gerekecektir FIRActionCodeSettings nesneyi handleCodeInApp true seti.

Süratli

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)

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

  1. Ayrıca, başlatıcıya ilettiğiniz URL'yi beyaz listeye eklemeniz gerekir. Sen bunu başarabilir Firebase konsoluna , Kimlik Doğrulama bölümünü açın. Yöntem sekmesinde İşaret Üzerine, Yetkili etki altından ekleyin.

  2. Derin bağlantıyı yakaladığınızda, ele alınabilmesi için onu yetkilendirme kullanıcı arayüzüne iletmeniz gerekecektir.

Süratli

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

Amaç-C

[[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];
  1. E-posta bağlantısı oturum açma FirebaseUI-iOS'taki uyumlu FirebaseUI-Android ve FirebaseUI-web nerede FirebaseUI-web ile oturum açma bağlantısını ve komple açabilirsiniz FirebaseUI-Android'den akışını başlayan bir kullanıcı. Aynı şey ters akış için de geçerlidir.

elma

  1. Başlamadan önce uygulayın ve Apple Firebase veri gereksinimleri bölümleri anonim uyun Elma ile Oturum rehberi.

  2. Yetkilendirme dosyanıza Apple ile Giriş Yap özelliğini ekleyin.

  3. Apple ile Giriş Yap için yapılandırılmış bir OAuth sağlayıcı örneğini başlatın:

    Süratli

    provider = FUIOAuth.appleAuthProvider()

    Amaç-C

    FUIOAuth *provider = [FUIOAuth appleAuthProvider];

Google

  1. In Firebase konsoluna , Kimlik Doğrulama bölümünü açmak ve Google oturum açma sağlar.

  2. Xcode projenize ters çevrilmiş müşteri kimliğinizi bir URL şeması olarak ekleyin. Sen Bu değeri bulabilirsiniz GoogleService-Info.plist dosyasında.

Facebook

  1. İzleyerek Facebook Giriş SDK kurma Facebook'un başlarken sayfasını .

  2. In Firebase konsoluna , Kimlik Doğrulama bölümünü açmak ve Facebook etkinleştirin. Facebook'ta oturum açmayı etkinleştirmek için Facebook Geliştiricileri konsolunda alabileceğiniz Facebook Uygulama Kimliğinizi ve Uygulama Sırrınızı sağlamanız gerekir.

  3. Proje Ayarları> Yetenekleri ekranından Xcode projesinde anahtarlık paylaşımını etkinleştirin.

  4. Ekle fb FACEBOOK_APP_ID Xcode projesinde bir URL şeması olarak.

  5. İçin Facebook Uygulama Kimliği ve görünen ad ekleyin Info.plist dosyasında:

    Anahtar Değer
    FacebookAppID FACEBOOK_APP_ID (örneğin, 1234567890 )
    FacebookGörünenAdı Uygulamanızın adı

  6. Bir Facebook sağlayıcı örneğini başlatın:

    Süratli

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

    Amaç-C

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

  7. Kullanmak isterseniz Facebook Sınırlı Girişi , set useLimitedLogin mülk FUIFacebookAuth örneği.

    Süratli

    provider.useLimitedLogin = true

    Amaç-C

    provider.useLimitedLogin = YES;

heyecan

  1. In Firebase konsoluna , Kimlik Doğrulama bölümünü açmak ve Twitter'a sağlıyor. Twitter oturum açmayı etkinleştirmek için Twitter Uygulama Yönetimi konsolundan alabileceğiniz Twitter API tüketici anahtarınızı ve sırrınızı sağlamanız gerekir.

  2. Twitter girişi için yapılandırılmış bir OAuth sağlayıcı örneği başlatın:

    Süratli

    provider = FUIOAuth.twitterAuthProvider()

    Amaç-C

    FUIOAuth *provider = [FUIOAuth twitterAuthProvider];

Telefon numarası

  1. In Firebase konsoluna , Kimlik Doğrulama bölümünü açmak ve telefon numarası oturumu etkinleştirebilirsiniz.

  2. Firebase, telefon numarası oturum açma isteklerinin uygulamanızdan geldiğini doğrulayabilmelidir. Bunun gerçekleştirilme yollarından biri APN bildirimleridir. Bkz Uygulama doğrulama etkinleştirin detaylar için.

    APNs bildirimlerini Firebase Authentication ile kullanmak üzere etkinleştirmek için:

    1. Xcode olarak, push bildirimleri etkinleştirmek projeniz için.

    2. APNs kimlik doğrulama anahtarınızı Firebase'e yükleyin. Zaten bir APN'ler kimlik doğrulama anahtarı yoksa, içinde oluşturmak için emin olun Elma Geliştirici Üye Merkezi .

      1. Firebase konsolunda proje içinde, dişli çark simgesini seçmek Proje Ayarları seçip Bulut Mesajlaşma sekmesini seçin.

      2. İOS uygulaması yapılandırması altında APN'ler kimlik doğrulama anahtarı, Yükle düğmesini tıklayın.

      3. , Anahtarını kaydettiğiniz konuma gidin, dosyayı seçin ve Aç'ı tıklayın. (Mevcut anahtar için anahtar kimliği ekle Elma Geliştirici Üye Merkezi ) ve Yükle'yi tıklayın.

      Zaten bir APNs sertifikanız varsa bunun yerine sertifikayı yükleyebilirsiniz.

  3. Bir cihazda APN bildirimleri alınamadığında Firebase, istekleri doğrulamak için reCAPTCHA'yı kullanır.

    reCAPTCHA doğrulamasını etkinleştirmek için, tersine çevrilmiş müşteri kimliğinizi henüz bir URL şeması olarak eklemediyseniz (örneğin, Google ile Oturum Açmayı etkinleştirmek için), bunu Xcode projenizde yapın. Sen Bu değeri bulabilirsiniz GoogleService-Info.plist dosyasında.

  4. Opsiyonel: Firebase, otomatik uygulamanızın APN belirteci elde etmek yöntemi swizzling kullanan Firebase uygulamanıza gönderdiği sessiz push bildirimleri işlemek için ve otomatik doğrulama sırasında reCAPTCHA doğrulaması sayfasındaki özel düzeni yönlendirme yolunu kesmek.

    Eğer kullanım swizzling tercih etmiyorsanız, bkz Ek: telefon oturum açma özelliğini kullanma swizzling olmadan Firebase SDK kimlik doğrulama docs.

Kayıt olmak

FirebaseUI oturum açma akışını başlatmak için önce FirebaseUI'yi başlatın:

Süratli

import FirebaseAuthUI

/* ... */

FirebaseApp.configure()
let authUI = FUIAuth.defaultAuthUI()
// You need to adopt a FUIAuthDelegate protocol to receive callback
authUI.delegate = self

Amaç-C

@import FirebaseAuthUI;

...

[FIRApp configure];
FUIAuth *authUI = [FUIAuth defaultAuthUI];
// You need to adopt a FUIAuthDelegate protocol to receive callback
authUI.delegate = self;

Ardından, desteklemek istediğiniz oturum açma yöntemlerini kullanmak için FirebaseUI'yi yapılandırın:

Süratli

import FirebaseAuthUI
import FirebaseFacebookAuthUI
import FirebaseGoogleAuthUI
import FirebaseOAuthUI
import FirebasePhoneAuthUI

let providers: [FUIAuthProvider] = [
  FUIGoogleAuth(),
  FUIFacebookAuth(),
  FUITwitterAuth(),
  FUIPhoneAuth(authUI:FUIAuth.defaultAuthUI()),
]
self.authUI.providers = providers

Amaç-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 veya Facebook oturum açmayı etkinleştirdiyseniz, Google ve Facebook kayıt akışlarının sonucu için bir işleyici uygulayın:

Süratli

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
}

Amaç-C

- (BOOL)application:(UIApplication *)app
            openURL:(NSURL *)url
            options:(NSDictionary *)options {
  NSString *sourceApplication = options[UIApplicationOpenURLOptionsSourceApplicationKey];
  return [[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];
}

Son olarak, bir örneğini almak AuthViewController dan FUIAuth . Daha sonra onu uygulamanızın ilk görünüm denetleyicisi olarak sunabilir veya uygulamanızdaki başka bir görünüm denetleyicisinden sunabilirsiniz.

Süratli

Oturum açma yöntemi seçicisini almak için:

let authViewController = authUI.authViewController()

Yalnızca telefon numarasıyla oturum açmayı kullanıyorsanız, bunun yerine doğrudan telefon numarası oturum açma görünümünü görüntüleyebilirsiniz:

let phoneProvider = FUIAuth.defaultAuthUI().providers.first as! FUIPhoneAuth
phoneProvider.signIn(withPresenting: currentlyVisibleController, phoneNumber: nil)

Amaç-C

Oturum açma yöntemi seçicisini almak için:

UINavigationController *authViewController = [authUI authViewController];

Yalnızca telefon numarasıyla oturum açmayı kullanıyorsanız, bunun yerine doğrudan telefon numarası oturum açma görünümünü görüntüleyebilirsiniz:

FUIPhoneAuth *phoneProvider = [FUIAuth defaultAuthUI].providers.firstObject;
[phoneProvider signInWithPresentingViewController:currentlyVisibleController phoneNumber:nil];

Eğer kimlik doğrulama görünümü ve kullanıcı işaretler sergiledikleri sonra, sonuç içinde FirebaseUI Auth temsilci döndürülür didSignInWithUser:error: yöntemi:

Süratli

func authUI(_ authUI: FUIAuth, didSignInWith user: FIRUser?, error: Error?) {
  // handle user and error as necessary
}

Amaç-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.
}

Oturumu Kapat

FirebaseUI, tüm sosyal kimlik sağlayıcılarının yanı sıra Firebase Authentication'dan çıkış yapmak için kolaylık yöntemleri sağlar:

Süratli

authUI.signOut()

Amaç-C

[authUI signOut];

özelleştirme

Sen FirebaseUI görüşüne denetleyicileri sınıflara ve içinde belirterek oturum açma ekranları özelleştirebilirsiniz FUIAuth bireyin temsilci yöntemlerine:

Süratli

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

Amaç-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'yi, hesap oluşturma ekranında bağlantılı olan uygulamanızın hizmet şartlarına göre özelleştirebilirsiniz:

Süratli

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

Amaç-C

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

Son olarak, özel bir paket belirterek kullanıcılarınıza gösterilen mesajları ve istemleri özelleştirebilirsiniz:

Süratli

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

Amaç-C

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

Sonraki adımlar

  • Kullanarak ve FirebaseUI özelleştirme hakkında daha fazla bilgi için bkz README GitHub'dan dosyayı.
  • Bulup FirebaseUI sorunu ve bunu rapor etmek isterseniz, kullanmak GitHub sorunu izci .