Facebook Account Kit SMS Authentication – Android tutorial with a demo sample.
Facebook provides Account Kit which helps you to register users through phone number. SMS verification is handled by Facebook Account Kit, so you don’t have to handle and spend on SMS verification.
I have compiled a simple step by step guide to integrate Account Kit in your Android app.
1. Generate Key Hash
Before creating an app on Facebook we need to generate our key hash using keystore which your app is using. During development stage this would generally be debug.keystore.
Go to java bin directory and execute following command. In case if you haven’t downloaded open-ssl yet, download it from here.
Command:
keytool -exportcert -alias androiddebugkey -keystore {path-to-debug-keystore} | {path-to-openssl.exe} sha1 -binary | {path-to-openssl.exe} base64
Example:
keytool -exportcert -alias androiddebugkey -keystore %HOMEPATH%\.android\debug.keystore | "D:\Setup\SetupFiles\openssl-0.9.8k_X64\bin\openssl.exe" sha1 -binary | "D:\Setup\SetupFiles\openssl-0.9.8k_X64\bin\openssl.exe" base64
This will output a string, which is your key hash.
2. Create a Facebook App.
Go to – https://developers.facebook.com/quickstarts/?platform=android and enter name of your app
Add package and class name.
Add hash key generated in previous step and click next.
3. Add Account Kit to your Facebook App
Click on Skip Quickstart, which will take you to your Application’s settings page.
Copy app id from app settings page and save it in notepad (Keep it handy)
Click on Add Product and click on Get Started for Account Kit
Turn server side authentication OFF
(In this demo we are only working on client side i.e. Android side. Though for better security it is always better to handle this on server side, which we shall cover in next Tutorial)
Copy Account Kit Client Token to notepad (Keep it handy)
4. Android Integration
a. Gradle Dependencies
Add dependency in gradle for Account Kit
repositories { jcenter() } dependencies { compile 'com.facebook.android:account-kit-sdk:4.+' }
b. Android Manifest
Add the following to the AndroidManifest.xml
<meta-data android:name="com.facebook.accountkit.ApplicationName" android:value="@string/app_name" /> <meta-data android:name="com.facebook.sdk.ApplicationId" android:value="@string/facebook_app_id" /> <meta-data android:name="com.facebook.accountkit.ClientToken" android:value="@string/account_kit_client_token" /> <activity android:name="com.facebook.accountkit.ui.AccountKitActivity" android:theme="@style/AppLoginTheme" tools:replace="android:theme"/>
c. Resource Files
Add following to strings.xml
<string name="facebook_app_id">309005412803023</string> <string name="account_kit_client_token">31cf85881dfb73adf2e4b0ed275ccb9a</string>
Add following Style to styles.xml
<style name="AppLoginTheme" parent="Theme.AccountKit" > <item name="android:windowNoTitle">true</item> </style>
d. Java Files
Initialize Facebook Account Kit in your Application class, don’t forget to add this class in “android:name” attribute in your application tag of manifest file.
public class AccountKitDemoApplication extends Application{ @Override public void onCreate() { super.onCreate(); //Initialize Facebook Account Kit AccountKit.initialize(getApplicationContext()); } }
Initialize Sms Flow.
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initAccountKitSmsFlow(); } /** * Initializes Facebook Account Kit Sms flow registration. */ public void initAccountKitSmsFlow() { final Intent intent = new Intent(this, AccountKitActivity.class); AccountKitConfiguration.AccountKitConfigurationBuilder configurationBuilder = new AccountKitConfiguration.AccountKitConfigurationBuilder( LoginType.PHONE, AccountKitActivity.ResponseType.TOKEN); // or .ResponseType.TOKEN // ... perform additional configuration ... intent.putExtra( AccountKitActivity.ACCOUNT_KIT_ACTIVITY_CONFIGURATION, configurationBuilder.build()); startActivityForResult(intent, APP_REQUEST_CODE); }
Facebook will handle SMS verification from here on, and return you the result on onActivityResult(). If SMS verfication is done successfully AccountKit.getCurrentAccount() to get user’s verified phone number.
@Override protected void onActivityResult( final int requestCode, final int resultCode, final Intent data) { super.onActivityResult(requestCode, resultCode, data); if (requestCode == APP_REQUEST_CODE) { // confirm that this response matches your request AccountKitLoginResult loginResult = data.getParcelableExtra(AccountKitLoginResult.RESULT_KEY); String toastMessage= ""; if (loginResult.getError() != null) { toastMessage = loginResult.getError().getErrorType().getMessage(); } else if (loginResult.wasCancelled()) { toastMessage = "Login Cancelled"; } else { if (loginResult.getAccessToken() != null) { toastMessage = "Success:" + loginResult.getAccessToken().getAccountId(); getAccount(); } } // Surface the result to your user in an appropriate way. Toast.makeText( this, toastMessage, Toast.LENGTH_LONG) .show(); } } /** * Gets current account from Facebook Account Kit which include user's phone number. */ private void getAccount(){ AccountKit.getCurrentAccount(new AccountKitCallback<Account>() { @Override public void onSuccess(final Account account) { // Get Account Kit ID String accountKitId = account.getId(); // Get phone number PhoneNumber phoneNumber = account.getPhoneNumber(); String phoneNumberString = phoneNumber.toString(); // Surface the result to your user in an appropriate way. Toast.makeText( MainActivity.this, phoneNumberString, Toast.LENGTH_LONG) .show(); } @Override public void onError(final AccountKitError error) { Log.e("AccountKit",error.toString()); // Handle Error } }); }
68,043 total views, 50 views today