Authenticating with Facebook

Firebase Simple Login provides an easy way to integrate Facebook authentication in your app.

Configuring Your Facebook Application

If you have not already done so, create a new Facebook application at https://developers.facebook.com/apps.

In your Facebook application configuration, go to the "Settings" tab and set your 'Site URL' to:

https://auth.firebase.com/auth/facebook/callback

After configuring your Facebook application, copy your Facebook application credentials (App ID and App Secret) into the "Simple Login" tab in your Firebase. See Firebase Simple Login (Web) Overview for more configuration details.

Integrating Firebase Simple Login

You'll need to include the Firebase Simple Login, which you can do with the following script include:

<script type='text/javascript'
        src='https://cdn.firebase.com/js/simple-login/1.3.2/firebase-simple-login.js'>
</script>

and also create an instance of the FirebaseSimpleLogin object, as detailed in Firebase Simple Login (Web) Overview:

var chatRef = new Firebase('https://<YOUR-FIREBASE>.firebaseio.com');
var auth = new FirebaseSimpleLogin(chatRef, function(error, user) {
  ...
});

Logging Users In

If your user does not have an existing session, you can prompt the user to login and then invoke the Facebook login popup (e.g. after they've clicked a 'Login' button) with the following snippet:

auth.login('facebook');

Optional Settings

Name Description Type
access_token Skip the OAuth popup-dialog and create a user session directly using an existing Facebook access token. Use this option to continue using the Facebook JS SDK as the primary authentication method in your application. String
debug Set to true to enable debug output from your Security Rules. This debug output will automatically output to the JavaScript console for any client that's authenticated with a token with the debug flag set to true Boolean
preferRedirect Redirect the browser to Facebook, and back to your site, instead of using a popup. Boolean
rememberMe Override default session length (browser session) to be 30 days. Boolean
scope A comma-delimited list of requested extended permissions. See https://developers.facebook.com/docs/reference/login/#permissions for more information. String

Here is an example where the session will be stored for 30 days and we also request some extended permissions.

auth.login('facebook', {
  rememberMe: true,
  scope: 'email,user_likes'
});

After Authenticating

Now that the client is logged in, your Security Rules will have access to their verified Facebook user id. Specifically, the auth variable will contain the following values:

Field Description Type
id The user's Facebook id. String
provider The authentication method used, in this case: 'facebook'. String
uid A unique id combining the provider and id, intended as the unique key for user data. String

See Security Rules, Security Rules Overview, and auth for more details on rule expressions and using the 'auth' variable.

User Object Data

The 'user' object returned to your callback contains some additional data as a convenience. At a minimum, it will contain the fields indicated below:

Field Description Type
accessToken The Facebook access token. String
displayName The user's display name. String
firebaseAuthToken The Firebase authentication token for this session. String
id The user's Facebook id. String
provider The authentication method used, in this case: 'facebook'. String
thirdPartyUserData User account data returned by Facebook. Object
uid A unique id combining the provider and id, intended as the unique key for user data. String

Have a suggestion to improve the documentation on this page? Tell us!