FirebaseUI کتابخانهای است که بر پایهی SDK احراز هویت فایربیس ساخته شده و جریانهای رابط کاربری drop-in را برای استفاده در برنامهی شما فراهم میکند. FirebaseUI مزایای زیر را ارائه میدهد:
- ارائه دهندگان متعدد : جریانهای ورود به سیستم برای ایمیل/رمز عبور، لینک ایمیل، احراز هویت تلفنی، ورود به سیستم با گوگل، ورود به سیستم با فیسبوک و ورود به سیستم با توییتر.
- مدیریت حساب : جریانهایی برای انجام وظایف مدیریت حساب، مانند ایجاد حساب و بازنشانی رمز عبور.
- پیوند حسابهای ناشناس : جریانهایی برای پیوند خودکار حسابهای ناشناس به ارائهدهندگان هویت.
- قابل تنظیم : ظاهر 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 ، بخش Authentication را باز کنید و احراز هویت از طریق ایمیل و رمز عبور را فعال کنید.
احراز هویت لینک ایمیل
در کنسول Firebase ، بخش احراز هویت (Authentication) را باز کنید. در تب روش ورود (Sign in method) ، ارائهدهنده ایمیل/رمز عبور ( Email/Password provider) را فعال کنید. توجه داشته باشید که برای استفاده از ورود با لینک ایمیل، باید ورود با ایمیل یا رمز عبور فعال باشد.
در همان بخش، روش ورود به سیستم با لینک ایمیل (ورود بدون رمز عبور) را فعال کرده و روی ذخیره کلیک کنید.
شما میتوانید با مقداردهی اولیه یک نمونه
FUIEmailAuthباFIREmailLinkAuthSignInMethod، ورود از طریق لینک ایمیل را فعال کنید. همچنین باید یک شیءFIRActionCodeSettingsمعتبر با مقداردهیhandleCodeInAppروی true ارائه دهید.سویفت
var actionCodeSettings = ActionCodeSettings() actionCodeSettings.url = URL(string: "https://example.firebasestorage.app") 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)هدف-سی
FIRActionCodeSettings *actionCodeSettings = [[FIRActionCodeSettings alloc] init]; actionCodeSettings.URL = [NSURL URLWithString:@"https://example.firebasestorage.app"]; 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 انجام دهید، بخش Authentication را باز کنید. در تب Sign in method ، URL را در زیر Authorized domains اضافه کنید.
زمانی که لینک عمیق را دریافت کردید، باید آن را به رابط کاربری احراز هویت ارسال کنید تا بتوان آن را مدیریت کرد.
سویفت
FUIAuth.defaultAuthUI()!.handleOpen(url, sourceApplication: sourceApplication)هدف-سی
[[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];ورود از طریق لینک ایمیل در FirebaseUI-iOS با FirebaseUI-Android و FirebaseUI-web سازگار است، به این صورت که کاربری که جریان را از FirebaseUI-Android شروع میکند، میتواند لینک را باز کرده و با FirebaseUI-web ورود را تکمیل کند. همین امر برای جریان مخالف نیز صادق است.
اپل
بخشهای «قبل از شروع» و «مطابق با الزامات دادههای ناشناس اپل» را در راهنمای ورود به سیستم با اپل در فایربیس دنبال کنید.
قابلیت ورود با اپل (Sign in with Apple) را به فایل مجوزهای خود اضافه کنید.
یک نمونه ارائه دهنده OAuth که برای ورود با اپل پیکربندی شده است را مقداردهی اولیه کنید:
سویفت
provider = FUIOAuth.appleAuthProvider()
هدف-سی
FUIOAuth *provider = [FUIOAuth appleAuthProvider];
گوگل
- با استفاده از این آموزش، ورود به سیستم گوگل را تنظیم کنید
فیسبوک
با دنبال کردن صفحه شروع به کار فیسبوک، SDK ورود به سیستم فیسبوک را راهاندازی کنید.
در کنسول Firebase ، بخش Authentication (احراز هویت) را باز کنید و Facebook را فعال کنید. برای فعال کردن ورود به سیستم Facebook، باید شناسه برنامه Facebook و راز برنامه خود را ارائه دهید که میتوانید آنها را در کنسول توسعهدهندگان Facebook دریافت کنید.
اشتراکگذاری keychain را در پروژه Xcode خود از صفحه تنظیمات پروژه > قابلیتها فعال کنید.
fb FACEBOOK_APP_IDبه عنوان یک طرح URL در پروژه Xcode خود اضافه کنید.شناسه برنامه فیسبوک و نام نمایشی خود را به فایل
Info.plistاضافه کنید:کلید ارزش شناسه برنامه فیسبوک FACEBOOK_APP_ID(برای مثال،1234567890)نام نمایشی فیسبوک نام برنامه شما مقداردهی اولیه یک نمونه از ارائه دهنده فیسبوک:
سویفت
provider = FUIFacebookAuth(authUI: FUIAuth.defaultAuthUI())
هدف-سی
FUIFacebookAuth *provider = [[FUIFacebookAuth alloc] initWithAuthUI:[FUIAuth defaultAuthUI]];
اگر میخواهید از ورود محدود فیسبوک استفاده کنید، ویژگی
useLimitedLoginرا روی نمونهFUIFacebookAuthتنظیم کنید.سویفت
provider.useLimitedLogin = true
هدف-سی
provider.useLimitedLogin = YES;
توییتر
در کنسول Firebase ، بخش احراز هویت (Authentication) را باز کنید و توییتر (Twitter) را فعال کنید. برای فعال کردن ورود به سیستم توییتر، باید کلید و رمز مصرفکننده API توییتر خود را ارائه دهید که میتوانید آنها را در کنسول مدیریت برنامه توییتر (Twitter Application Management) دریافت کنید.
یک نمونه ارائه دهنده OAuth که برای ورود به سیستم توییتر پیکربندی شده است را مقداردهی اولیه کنید:
سویفت
provider = FUIOAuth.twitterAuthProvider()
هدف-سی
FUIOAuth *provider = [FUIOAuth twitterAuthProvider];
شماره تلفن
در کنسول Firebase ، بخش احراز هویت (Authentication) را باز کنید و ورود با شماره تلفن را فعال کنید.
فایربیس باید بتواند تأیید کند که درخواستهای ورود با شماره تلفن از برنامه شما میآیند. یکی از راههای انجام این کار از طریق اعلانهای APN است. برای جزئیات بیشتر به فعال کردن تأیید برنامه مراجعه کنید.
برای فعال کردن اعلانهای APN برای استفاده با Firebase Authentication :
در Xcode، اعلانهای فوری (push notifications) را برای پروژه خود فعال کنید .
کلید احراز هویت APN خود را در Firebase آپلود کنید. اگر از قبل کلید احراز هویت APN ندارید، حتماً آن را در مرکز اعضای توسعهدهنده اپل ایجاد کنید.
در داخل پروژه خود در کنسول Firebase ، نماد چرخ دنده را انتخاب کنید، تنظیمات پروژه را انتخاب کنید و سپس برگه Cloud Messaging را انتخاب کنید.
در کلید احراز هویت APNs در بخش پیکربندی برنامه iOS ، روی دکمه آپلود کلیک کنید تا کلید احراز هویت توسعه یا کلید احراز هویت تولید یا هر دو را آپلود کنید. حداقل یکی از آنها لازم است.
به محلی که کلید خود را ذخیره کردهاید بروید، آن را انتخاب کنید و روی «باز کردن» کلیک کنید. شناسه کلید را برای کلید (که در مرکز اعضای توسعهدهنده اپل موجود است) اضافه کنید و روی «بارگذاری» کلیک کنید.
اگر از قبل گواهی APN دارید، میتوانید به جای آن گواهی را آپلود کنید.
وقتی اعلانهای APN روی دستگاهی دریافت نمیشوند، Firebase از reCAPTCHA برای تأیید درخواستها استفاده میکند.
برای فعال کردن تأیید reCAPTCHA، مراحل زیر را در Xcode انجام دهید:
- پیکربندی پروژه خود را باز کنید: روی نام پروژه در نمای درختی سمت چپ دوبار کلیک کنید. برنامه خود را از بخش TARGETS انتخاب کنید، سپس تب Info را انتخاب کنید و بخش URL Types را باز کنید.
- روی دکمه + کلیک کنید و شناسه برنامه رمزگذاری شده خود را به عنوان یک طرح URL اضافه کنید. میتوانید شناسه برنامه رمزگذاری شده خود را در صفحه تنظیمات عمومی کنسول Firebase، در بخش برنامه iOS خود پیدا کنید. سایر فیلدها را خالی بگذارید.
پس از تکمیل، پیکربندی شما باید چیزی شبیه به موارد زیر باشد (اما با مقادیر خاص برنامه شما):
اختیاری : فایربیس از متد swizzling برای دریافت خودکار توکن APN برنامه شما، مدیریت اعلانهای بیصدا که فایربیس به برنامه شما ارسال میکند و رهگیری خودکار تغییر مسیر طرح سفارشی از صفحه تأیید 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
هدف-سی
@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
هدف-سی
@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;
اگر ورود به سیستم از طریق گوگل یا فیسبوک را فعال کردهاید، یک کنترلکننده برای نتیجهی جریانهای ثبت نام گوگل و فیسبوک پیادهسازی کنید:
سویفت
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
}
هدف-سی
- (BOOL)application:(UIApplication *)app
openURL:(NSURL *)url
options:(NSDictionary *)options {
NSString *sourceApplication = options[UIApplicationOpenURLOptionsSourceApplicationKey];
return [[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];
}
در نهایت، یک نمونه از AuthViewController از FUIAuth دریافت کنید. سپس میتوانید آن را به عنوان اولین view controller برنامه خود ارائه دهید یا آن را از یک view controller دیگر در برنامه خود ارائه دهید.
سویفت
برای دریافت انتخابگر روش ورود:
let authViewController = authUI.authViewController()
اگر فقط از ورود با شماره تلفن استفاده میکنید، میتوانید نمای ورود با شماره تلفن را مستقیماً نمایش دهید:
let phoneProvider = FUIAuth.defaultAuthUI().providers.first as! FUIPhoneAuth
phoneProvider.signIn(withPresenting: currentlyVisibleController, phoneNumber: nil)
هدف-سی
برای دریافت انتخابگر روش ورود:
UINavigationController *authViewController = [authUI authViewController];
اگر فقط از ورود با شماره تلفن استفاده میکنید، میتوانید نمای ورود با شماره تلفن را مستقیماً نمایش دهید:
FUIPhoneAuth *phoneProvider = [FUIAuth defaultAuthUI].providers.firstObject;
[phoneProvider signInWithPresentingViewController:currentlyVisibleController phoneNumber:nil];
پس از نمایش نمای احراز هویت و ورود کاربر، نتیجه به نماینده FirebaseUI Auth در متد didSignInWithUser:error: بازگردانده میشود:
سویفت
func authUI(_ authUI: FUIAuth, didSignInWith user: FIRUser?, error: Error?) {
// handle user and error as necessary
}
هدف-سی
- (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()
هدف-سی
[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)
}
هدف-سی
- (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
هدف-سی
authUI.TOSURL = [NSURL URLWithString:@"https://example.com/terms"];
در نهایت، میتوانید پیامها و اعلانهای نمایش داده شده به کاربران خود را با مشخص کردن یک بسته سفارشی سفارشی کنید:
سویفت
authUI.customStringsBundle = NSBundle.mainBundle() // Or any custom bundle.
هدف-سی
authUI.customStringsBundle = [NSBundle mainBundle]; // Or any custom bundle.
مراحل بعدی
- برای اطلاعات بیشتر در مورد استفاده و سفارشیسازی FirebaseUI، به فایل README در GitHub مراجعه کنید.
- اگر در FirebaseUI با مشکلی مواجه شدید و میخواهید آن را گزارش دهید، از ردیاب مشکل GitHub استفاده کنید.