Google is committed to advancing racial equity for Black communities. See how.
ترجمت واجهة Cloud Translation API‏ هذه الصفحة.
Switch to English

أضف تسجيل الدخول بسهولة إلى تطبيق iOS الخاص بك باستخدام FirebaseUI

FirebaseUI عبارة عن مكتبة مبنية على Firebase Authentication SDK والتي توفر تدفقات واجهة المستخدم لاستخدامها في تطبيقك. يوفر FirebaseUI المزايا التالية:

  • مزودون متعددون : تدفقات تسجيل الدخول للبريد الإلكتروني / كلمة المرور ، ورابط البريد الإلكتروني ، ومصادقة الهاتف ، وتسجيل الدخول إلى Google ، وتسجيل الدخول إلى Facebook ، وتسجيل الدخول إلى Twitter.
  • إدارة الحساب : تدفقات للتعامل مع مهام إدارة الحساب ، مثل إنشاء الحساب وإعادة تعيين كلمة المرور.
  • ربط الحساب المجهول : يتدفق لربط الحسابات المجهولة تلقائيًا بموفري الهوية.
  • قابل للتخصيص: خصص مظهر FirebaseUI ليلائم تطبيقك. أيضًا ، نظرًا لأن FirebaseUI مفتوح المصدر ، يمكنك تقسيم المشروع وتخصيصه وفقًا لاحتياجاتك تمامًا.

قبل ان تبدأ

  1. أضف Firebase إلى مشروع iOS الخاص بك .

  2. أضف 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'
    
  3. إذا لم تكن قد ربطت تطبيقك بمشروع Firebase حتى الآن ، فافعل ذلك من وحدة تحكم Firebase .

قم بإعداد طرق تسجيل الدخول

قبل أن تتمكن من استخدام Firebase لتسجيل دخول المستخدمين ، يجب عليك تمكين وتهيئة طرق تسجيل الدخول التي تريد دعمها.

عنوان البريد الإلكتروني وكلمة المرور

في وحدة تحكم Firebase ، افتح قسم المصادقة وقم بتمكين مصادقة البريد الإلكتروني وكلمة المرور.

  1. في وحدة تحكم Firebase ، افتح قسم المصادقة . في علامة التبويب طريقة تسجيل الدخول ، قم بتمكين موفر البريد الإلكتروني / كلمة المرور . لاحظ أنه يجب تمكين تسجيل الدخول إلى البريد الإلكتروني / كلمة المرور لاستخدام تسجيل الدخول إلى رابط البريد الإلكتروني.

  2. في نفس القسم ، قم بتمكين طريقة تسجيل الدخول لرابط البريد الإلكتروني (تسجيل الدخول بدون كلمة مرور) وانقر فوق حفظ .

  3. يمكنك تمكين علامة صلة البريد الإلكتروني من قبل في تهيئة و 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)

ج موضوعية

اي 8d571f563
  1. بالإضافة إلى ذلك ، تحتاج إلى إدراج عنوان URL الذي تقوم بتمريره إلى iniatializer. يمكنك القيام بذلك في وحدة تحكم Firebase ، افتح قسم المصادقة . في علامة التبويب طريقة تسجيل الدخول ، أضف عنوان URL ضمن المجالات المصرح بها .

  2. بمجرد التقاط الرابط لموضع معين ، ستحتاج إلى تمريره إلى واجهة مستخدم المصادقة حتى يمكن التعامل معه.

سويفت

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

ج موضوعية

[[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];
  1. تسجيل الدخول إلى رابط البريد الإلكتروني في Firebase يتوافق UI-iOS مع FirebaseUI-Android و FirebaseUI-web حيث يمكن لمستخدم واحد يبدأ التدفق من FirebaseUI-Android فتح الرابط وإكمال تسجيل الدخول باستخدام FirebaseUI-web. وينطبق الشيء نفسه على التدفق المعاكس.

تفاحة

  1. اتبع قبل أن تبدأ والامتثال لأقسام متطلبات البيانات المجهولة من Apple في دليل Firebase Sign in with Apple .

  2. أضف إمكانية تسجيل الدخول باستخدام Apple إلى ملف استحقاقاتك.

  3. ابدأ بتهيئة مثيل موفر OAuth مهيأ لتسجيل الدخول مع Apple:

    سويفت

    provider = FUIOAuth.appleAuthProvider()
    

    ج موضوعية

    FUIOAuth *provider = [FUIOAuth appleAuthProvider];
    

جوجل

  1. في وحدة تحكم Firebase ، افتح قسم المصادقة وقم بتمكين تسجيل الدخول إلى Google.

  2. أضف معرّف العميل المعكوس كمخطط URL في مشروع Xcode الخاص بك. يمكنك العثور على هذه القيمة في ملف GoogleService-Info.plist .

موقع التواصل الاجتماعي الفيسبوك

  1. قم بإعداد Facebook Login SDK باتباع صفحة البدء في Facebook .

  2. في وحدة تحكم Firebase ، افتح قسم المصادقة وقم بتمكين Facebook. لتمكين تسجيل الدخول إلى Facebook ، يجب عليك تقديم معرف تطبيق Facebook وسر التطبيق ، والتي يمكنك الحصول عليها في وحدة تحكم مطوري Facebook.

  3. قم بتمكين مشاركة سلسلة المفاتيح في مشروع Xcode الخاص بك من إعدادات المشروع> شاشة القدرات .

  4. أضف fb FACEBOOK_APP_ID كمخطط URL في مشروع Xcode الخاص بك.

  5. أضف معرف تطبيق Facebook واسم العرض إلى ملف Info.plist :

    مفتاح القيمة
    معرف التطبيق FACEBOOK_APP_ID (على سبيل المثال ، 1234567890 )
    الاسم اسم التطبيق الخاص بك

تويتر

  1. في وحدة تحكم Firebase ، افتح قسم المصادقة وقم بتمكين Twitter. لتمكين تسجيل الدخول إلى Twitter ، يجب عليك تقديم مفتاح وسر عميل واجهة برمجة تطبيقات Twitter ، والذي يمكنك الحصول عليه في وحدة تحكم إدارة تطبيقات Twitter.

  2. قم بتهيئة مثيل موفر OAuth المهيأ لتسجيل الدخول إلى Twitter:

    سويفت

    provider = FUIOAuth.twitterAuthProvider()
    

    ج موضوعية

    FUIOAuth *provider = [FUIOAuth twitterAuthProvider];
    

رقم الهاتف

  1. في وحدة تحكم Firebase ، افتح قسم المصادقة وقم بتمكين تسجيل الدخول إلى رقم الهاتف.

  2. يجب أن يكون Firebase قادرًا على التحقق من أن طلبات تسجيل الدخول إلى رقم الهاتف واردة من تطبيقك. إحدى الطرق التي يتم بها تحقيق ذلك هي من خلال إشعارات APN. راجع تمكين التحقق من التطبيق للحصول على التفاصيل.

    لتمكين إعلامات APN للاستخدام مع مصادقة Firebase:

    1. في Xcode ، قم بتمكين دفع الإخطارات لمشروعك.

    2. قم بتحميل مفتاح مصادقة APNs على Firebase. إذا لم يكن لديك بالفعل مفتاح مصادقة APNs ، فراجع تكوين APNs باستخدام FCM .

      1. داخل مشروعك في وحدة تحكم Firebase ، حدد رمز الترس ، وحدد إعدادات المشروع ، ثم حدد علامة التبويب Cloud Messaging .

      2. في مفتاح مصادقة APN ضمن تكوين تطبيق iOS ، انقر فوق الزر تحميل .

      3. استعرض للوصول إلى الموقع الذي قمت فيه بحفظ مفتاحك ، وحدده ، وانقر فوق فتح . أضف معرف المفتاح للمفتاح (متوفر في الشهادات والمعرفات والملفات الشخصية في مركز أعضاء مطوري Apple ) وانقر فوق تحميل .

      إذا كان لديك بالفعل شهادة APNs ، فيمكنك تحميل الشهادة بدلاً من ذلك.

  3. عندما يتعذر تلقي إشعارات APN على جهاز ما ، يستخدم Firebase reCAPTCHA للتحقق من الطلبات.

    لتمكين التحقق من reCAPTCHA ، إذا لم تكن قد أضفت بالفعل معرف العميل المعكوس كمخطط URL (على سبيل المثال ، لتمكين تسجيل الدخول إلى Google) ، فقم بذلك في مشروع Xcode الخاص بك. يمكنك العثور على هذه القيمة في ملف GoogleService-Info.plist .

  4. اختياري : يستخدم Firebase طريقة swizzling للحصول تلقائيًا على رمز APNs المميز للتطبيق الخاص بك ، وللتعامل مع إشعارات الدفع الصامت التي يرسلها Firebase إلى تطبيقك ، ولاعتراض إعادة توجيه المخطط المخصص تلقائيًا من صفحة التحقق reCAPTCHA أثناء التحقق.

    إذا كنت تفضل عدم استخدام swizzling ، فراجع الملحق: استخدام تسجيل الدخول عبر الهاتف دون التبديل في مستندات مصادقة Firebase SDK.

تسجيل الدخول

لبدء تدفق تسجيل الدخول إلى FirebaseUI ، ابدأ أولاً بتهيئة FirebaseUI:

سويفت

import FirebaseUI

/* ... */

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

ج موضوعية

@import FirebaseUI;

...

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

بعد ذلك ، هيئ FirebaseUI لاستخدام طرق تسجيل الدخول التي تريد دعمها:

سويفت

import FirebaseUI

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

ج موضوعية

@import FirebaseUI;

...

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
}

ج موضوعية

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

ج موضوعية

للحصول على محدد طريقة تسجيل الدخول:

UINavigationController *authViewController = [authUI authViewController];

إذا كنت تستخدم فقط تسجيل الدخول برقم الهاتف ، فيمكنك عرض طريقة عرض تسجيل الدخول لرقم الهاتف مباشرةً بدلاً من ذلك:

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

بعد تقديم عرض المصادقة وتسجيل المستخدم الدخول ، يتم إرجاع النتيجة إلى مفوض مصادقة didSignInWithUser:error: في didSignInWithUser:error: method:

سويفت

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

التخصيص

يمكنك تخصيص شاشات تسجيل الدخول عن طريق تصنيف عناصر التحكم في عرض FUIAuth في طرق تفويض 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 .