Add Facebook Login to Native Apps

Add Facebook Login to Native Apps

You can add functionality to your native application to allow your users to authenticate using Facebook natively, within the application. This does not require redirection via a web browser and will let mobile applications comply with the Facebook Developer Policy, which requires that mobile applications use the Facebook SDK for Android or iOS to authenticate.

How it works

The Native Facebook login flow works as follows:

  • Step 1: The application authenticates a user via the Facebook SDK and acquires an Access Token.

  • Step 2: The application uses that Access Token to request a special Facebook Session Info Access Token.

  • Step 3: Use the Facebook SDK to retrieve the users's profile.

  • Step 4: The application can then use the Facebook Session Info token to authenticate with Auth0.

Prerequisites

Before you configure Native Facebook login for your native app via Auth0, you must:

  1. Set up Facebook as an Auth0 connection

  2. Use the relevant Facebook SDK in your application

  3. Navigate to Auth0 Dashboard > Applications > Applications, and create an application with Auth0 (if you have not already).

  4. At the bottom of the settings page, select Show Advanced Settings and then the Device Settings view. Under Native Social Login, enable the Enable Sign In with Facebook toggle.

    Native Social Login Settings

Implementation

The process to authenticate a user profile using Native Facebook login is a four-step one, from your application's perspective:

Step 1

The application authenticates a user via the Facebook SDK. It will obtain an Access Token from Facebook.

Step 2

The application uses the Access Token to request a Facebook Session Info Access Token.

This request will look similar to the following:

GET https://graph.facebook.com/v5.0/oauth/access_token?grant_type=fb_attenuate_token&client_id=457704041391802&fb_exchange_token=<facebook_access_token>

Was this helpful?

/

and the response:

{
    "access_token": "XAAGgR4b...1lHWNCpqrAhcpoAZDZD",
    "token_type": "bearer",
    "expires_in": 5183924
}

Was this helpful?

/

Step 3

The application needs to retrieve the user profile from Facebook using the Facebook SDK, which will end in a request similar to the following:

GET https://graph.facebook.com/v5.0/<facebook user id>?access_token=<facebook access token>&fields=email,name

Was this helpful?

/

Step 4

The application can then use the session info Access Token and the Facebook user profile to authenticate with Auth0 by calling Auth0's /oauth/token endpoint using the Token Exchange flow with the facebook-session-access-token token type. If all goes well, Auth0 will return a normal response from the exchange, with the addition of the user profile. The user profile should be a JSON object, encoded as a string.

to configure this snippet with your account

POST https://YOUR_DOMAIN/oauth/token

grant_type: 'urn:ietf:params:oauth:grant-type:token-exchange'
subject_token_type: 'http://auth0.com/oauth/token-type/facebook-info-session-access-token'
audience: 'your-api'
scope: 'read:appointments openid profile email email_verified'
subject_token: 'XAAGgR4b...1lHWNCpqrUHZAEtUuZAhcpoAZDZD'
client_id: 'YOUR_CLIENT_ID'
user_profile: '{"email":"john@example.com", "name":"John Doe"}'

Was this helpful?

/

and the response from Auth0:

{
    "access_token": "eyJ0eXA..yXQaPLVXg",
    "id_token": "eyJ0.tFE5HPipdOsA",
    "scope": "openid profile email read:appointments",
    "expires_in": 86400,
    "token_type": "Bearer"
}

Was this helpful?

/

User Profile and Email Validation

In the previous example, you had to retrieve the User Profile from Facebook and include it in the call to /oauth/token. This is because the Facebook Session Access Token cannot be used to directly retrieve the profile, and the Facebook Access Token cannot be sent directly to the server, due to Apple's AppStore Review Guidelines. Therefore, it must be retrieved in the client and sent to Auth0 in this fashion.

Given that Auth0 can't guarantee that the user profile is the same that was returned by Facebook, it will set the email_verified field to false.

Logout

Since the native login implementation does not make use of standard browser-based flows, application owners must also take care to perform logout appropriately. When an application needs to perform a logout, it should also Revoke the Auth0 Refresh Token.

Keep reading