With this Swift programming tutorial I’ll proceed working with Firebase Social Authentication and this time I’ll share with you easy methods to implement Signal-in with Fb account. In case you are fascinated by studying easy methods to use Firebase Social Authentication to implement Signal-in with Google account please test my earlier tutorial.
Create New or Open Present Xcode Venture
In my earlier tutorial the place I shared easy methods to implement SignIn with Google account, I’ve created a quite simple app with two views. One view with a login button and one other view is a protected web page which can open as soon as the consumer authentication is profitable. You’ll be able to create this Xcode mission with two views your self of you possibly can discuss with my earlier tutorial to see how I created a brand new Xcode mission.
Create New or Open Present Firebase App
Similar to with Xcode mission, in my earlier tutorial I’ve create a brand new Firebase App for use for Social Authentication performance. On this tutorial I’m going to proceed utilizing that Firebase app. Should you adopted my earlier tutorial on Google Signal, then I’m positive you wish to proceed with current Firebase app. Different smart, please discuss with my earlier tutorial to learn to create a brand new Firebase app and easy methods to add Firebase help to your iOS mission
Create New Fb App
To combine Fb Signal-in into your app observe the beneath steps:
- Go to Fb Builders web site and open Apps Dashboard. You’ll be able to open Facebooks Apps Dashboard by clicking on this URL: https://builders.fb.com/apps
- On the Apps Dashboard web page click on on Add a New App button,
- Give your app a brand new title and click on on Create App ID button. I gave my app this title “Firebase Social Authentication”.
- As soon as the app is created Don’t choose a product on the Choose Product web page however somewhat click on on the Settings hyperlink which is on the left facet navigation menu.
- Then, click on Add Platform on the backside of the web page and choose iOS,
- Now open your Xcode mission by clicking on .xcworkspace, choose mission title, then Targets -> Normal and from the Normal tab copy the Bundle Identifier worth. Paste the worth of Bundle Identifier into Bundle ID textual content area as on the image beneath,
- Then activate Single Signal On and click on on Save Modifications
From Fb App mission Dashboard you could copy the App ID and App Secret
after which head over to the Firebase Console, go to the Authentication web page and click on on the Signal-In strategies and allow Fb. Now copy the OAuth redirect URI
And return to your Fb App on Fb Apps Dashboard, click on in your app to open and in your left navigation menu within the Merchandise section-> Fb Login -> Settings it’s a must to paste the URI as it’s proven on the image beneath:
Including Firebase Fb Dependencies
To let customers Signal-in with their Fb account to our app we might want to add Fb Signal-in library dependency to our Xcode mission. And since we’ve began utilizing Pods as dependency administration we are going to use Pods as soon as once more so as to add the a number of Fb libraries: pod ‘FBSDKCoreKit’, pod ‘FBSDKShareKit’ and pod ‘FBSDKLoginKit‘ earlier than the top of your file.
- Open the terminal and go to your mission root listing.
- Then, in terminal window enter the next command open Podfile. Within the podfile it’s a must to add 2 new traces identical to within the picture beneath.
- Save the pod file
- Now, after you saved the pod file file, kind in terminal window the pod set up command.
Do not forget that after you began utilizing Pods to handle the libraries dependency on your mission you have to to be opening your mission utilizing the .xcworkspace somewhat than .xcodeproj.
Open the .xcworkspace and construct it to verify every little thing is okay. Then you definitely go to the information.plist file, open it as a supply code and add the next sequence by altering the [APP_ID] and [APP_NAME] with the app id and app title you bought earlier from the Venture Dashboard on Fb for Builders web page.
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<string>fb[APP_ID]</string>
</array>
</dict>
</array>
<key>FacebookAppID</key>
<string>[APP_ID]</string>
<key>FacebookDisplayName</key>
<string>[APP_NAME]</string>
Swift Code to Add the Login with Fb Account Characteristic
Then you definitely go to the AppDelegate file. Right here it’s a must to import FBSDKCoreKit then it’s a must to instantiate the FBSDKApplicationDelegate after which configure facebookAuthentication within the func utility(_ app: UIApplication, open url: URL, choices: [UIApplicationOpenURLOptionsKey : Any] = [:]) -> Bool.
My supply code is beneath. Should you didn’t observe my earlier tutorial about Google Sign up then merely delete Google associated traces.
var window: UIWindow?
func utility(_ utility: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
FirebaseApp.configure()
FBSDKApplicationDelegate.sharedInstance().utility(utility, didFinishLaunchingWithOptions: launchOptions)
GIDSignIn.sharedInstance().clientID = FirebaseApp.app()?.choices.clientID
GIDSignIn.sharedInstance().delegate = self
return true
}
func utility(_ app: UIApplication, open url: URL, choices: [UIApplicationOpenURLOptionsKey : Any] = [:]) -> Bool
Add Fb Login Button
Now it’s time so as to add the precise Fb log in button so you could head over to the ViewController file and create a brand new non-public operate to configure the button.
On this operate you could create the button, set its body, add it to the view, assign the ViewController as its delegate and conform the ViewController to the FBSDKLoginButtonDelegate by implementing its delegate strategies.
Within the loginButton technique it’s a must to test for errors and if there aren’t any errors you could create credentials with the FacebookAuthProvider. Then, it’s a must to authenticate through the use of this credential.
//creating the Fb register button
fileprivate func configureFacebookSignInButton() {
let facebookSignInButton = FBSDKLoginButton()
facebookSignInButton.body = CGRect(x: 120, y: 200 + 100, width: view.body.width - 240, top: 40)
view.addSubview(facebookSignInButton)
facebookSignInButton.delegate = self
}
//FBSDKLoginButton delegate strategies
func loginButton(_ loginButton: FBSDKLoginButton!, didCompleteWith end result: FBSDKLoginManagerLoginResult!, error: Error!) {
if error == nil {
print("Person simply logged in by way of Fb")
let credential = FacebookAuthProvider.credential(withAccessToken: FBSDKAccessToken.present().tokenString)
Auth.auth().signIn(with: credential, completion: { (consumer, error) in
if (error != nil) {
print("Fb authentication failed")
} else {
print("Fb authentication succeed")
}
})
} else {
print("An error occured the consumer could not log in")
}
}
func loginButtonDidLogOut(_ loginButton: FBSDKLoginButton!) {
print("Person simply logged out from his Fb account")
}
Then you definitely go to the data.plist file and also you add a brand new URL Scheme with the worth of “fb{AppID}”.
Now you’re all arrange and may run your utility and log in through the use of Fb.
I hope this tutorial was useful for you!
In case you are fascinated by studying extra about Firebase checkout out the beneath video programs which will certainly assist you pace up your studying progress and assist you develop your app with Swift and Firebase quicker.
