Facebook Account Kit using Swift
Account Kit helps people quickly and easily register and log into your app using their phone number or email address as passwordless credentials. Account Kit is powered by Facebook’s email and SMS sending infrastructure for reliable scalable performance with global reach. Because it uses email and phone number authentication, Account Kit doesn’t require a Facebook account and is the ideal alternative to a social login. Here is how to set up it:
1. Select an App or Create a New App
Select an app or create a new one from facebook developer account.
2. Choose Your App Settings
Choose whether to allow email and SMS login, and choose security settings for your app — Choose your app settings.
3. Set up Your Developer Environment
- Make sure you have the CocoaPods gem installed on your machine before installing the Account Kit pod.
- Add the following to your Podfile:
- Run the following command in your project root directory from a terminal window:
- Add both your Facebook App ID and Account Kit Client Token to your
Info.plistfile as strings. Make sure you have enabled Account Kit in the App Dashboard. You'll find the Account Kit client token in the Account Kit section of the App Dashboard. The application name will be used in the UI of the login screen.
Remember to fill in your app ID for both the
4. Configure Login View Controller
The delegate for your
loginViewController must implement the
AKFViewControllerDelegate protocol. All of the protocol methods are optional, but you should at least handle successful login callbacks for the login flows (SMS or Email) that you use in your app. Set up your main view controller to receive login callbacks:
Prepare the Account Kit login view controller by setting a delegate as shown in the following code block.
5. Handle Different Login States
When your initial view controller appears, you should bypass the login view controller if the user is already logged in. It will also resume pending logins if any are present.
To initialize Account Kit, we recommend doing this in the
viewDidLoad event of your view controller. The following code initializes Account Kit to use the token access flow:
If your app receives the user’s access token directly (because the Enable Client Access Token Flow switch in your app’s dashboard is ON), then you should check for a valid, existing token using accountKit?.currentAccessToken.
6. Initiate a Login Flow for SMS
In your initial view controller, create a phone login handler to invoke when the login button is clicked by the user. There are two important parameters shown in the code below:
7. Initiate a Login Flow for Email
In your initial view controller, create an email login handler to invoke when the login button is clicked by the user. There are two important parameters shown in the code below:
8. Handle Login Callback
To handle a successful login in Access Token mode:
To handle a successful login in Authorization Code mode:
You may also handle a failed or canceled login:
9. Access Account Information
Once you have successfully logged in, you can access account information. For example, to display the account ID and the login credential used in access token mode:
10. Provide the Logout Flow
You can invoke the
logOut method to log a user out of Account Kit.
Build and run the project :)
You can also download the sample project from GitHub.
Where to go from here
The onboarding experience is one of the most important user experiences in your app. Account Kit helps you quickly register for apps using just your phone number or email address — no password needed. It’s reliable, easy to use and gives you a choice about how you sign up for apps.
- The user interface for the login screens is provided by the SDK. You can customize the UI to match your app.
- By default, the Account Kit SDK allows users to enter a phone number for any country code supported by Account Kit — Configuring Country Code Availability for SMS.
- In the Account Kit section of the App Dashboard, you can customize the colors of the authentication email that the people receive so the authentication email matches the color scheme of you app.