passport-facebook

Passport strategy for authenticating with Facebook using OAuth 2.0.

This module lets you authenticate using Facebook in your Node.js applications. By plugging into Passport, Facebook Login can be easily and unobtrusively integrated into any application or framework that supports Connect-style middleware, including Express.

🌱 Tutorial • 🧠 Understanding OAuth 2.0 • ❤️ Sponsors

^{Developed by Jared Hanson.}

^{Advertisement}
The Complete Node.js Developer Course
Learn Node. js by building real-world applications with Node, Express, MongoDB, Jest, and more!

Install

$ npm install passport-facebook

Usage

Register Application

The Facebook strategy authenticates users using their Facebook account. Before your application can make use of Facebook's authentication system, you must first register your app. Once registered, an app ID and secret will be issued which are used by Facebook to identify your app. You will also need to configure a redirect URI which matches the route in your application.

Configure Strategy

Once you've registered your application, the strategy needs to be configured with your application's app ID and secret, along with its OAuth 2.0 redirect endpoint.

The strategy takes a verify function as an argument, which accepts accessToken, refreshToken, and profile as arguments. accessToken and refreshToken are used for API access, and are not needed for authentication. profile contains the user's profile information stored in their Facebook account. When authenticating a user, this strategy uses the OAuth 2.0 protocol to obtain this information via a sequence of redirects and API requests to Facebook.

The verify function is responsible for determining the user to which the Facebook account belongs. In cases where the account is logging in for the first time, a new user record is typically created automatically. On subsequent logins, the existing user record will be found via its relation to the Facebook account.

Because the verify function is supplied by the application, the app is free to use any database of its choosing. The example below illustrates usage of a SQL database.

var FacebookStrategy = require('passport-facebook');

passport.use(new FacebookStrategy({
    clientID: process.env['FACEBOOK_APP_ID'],
    clientSecret: process.env['FACEBOOK_APP_SECRET'],
    callbackURL: 'https://www.example.com/oauth2/redirect/facebook',
    state: true
  },
  function verify(accessToken, refreshToken, profile, cb) {
    db.get('SELECT * FROM federated_credentials WHERE provider = ? AND subject = ?', [
      'https://www.facebook.com',
      profile.id
    ], function(err, cred) {
      if (err) { return cb(err); }
      
      if (!cred) {
        // The account at Facebook has not logged in to this app before.  Create
        // a new user record and associate it with the Facebook account.
        db.run('INSERT INTO users (name) VALUES (?)', [
          profile.displayName
        ], function(err) {
          if (err) { return cb(err); }
          
          var id = this.lastID;
          db.run('INSERT INTO federated_credentials (user_id, provider, subject) VALUES (?, ?, ?)', [
            id,
            'https://www.facebook.com',
            profile.id
          ], function(err) {
            if (err) { return cb(err); }
            
            var user = {
              id: id,
              name: profile.displayName
            };
            return cb(null, user);
          });
        });
      } else {
        // The account at Facebook has previously logged in to the app.  Get the
        // user record associated with the Facebook account and log the user in.
        db.get('SELECT * FROM users WHERE id = ?', [ cred.user_id ], function(err, user) {
          if (err) { return cb(err); }
          if (!user) { return cb(null, false); }
          return cb(null, user);
        });
      }
    });
  }
));

Define Routes

Two routes are needed in order to allow users to log in with their Facebook account. The first route redirects the user to the Facebook, where they will authenticate:

app.get('/login/facebook', passport.authenticate('facebook'));

The second route processes the authentication response and logs the user in, after Facebook redirects the user back to the app:

app.get('/oauth2/redirect/facebook',
  passport.authenticate('facebook', { failureRedirect: '/login', failureMessage: true }),
  function(req, res) {
    res.redirect('/');
  });

Examples

todos-express-facebook

Illustrates how to use the Facebook strategy within an Express application. For developers new to Passport and getting started, a tutorial is available.
todos-express-facebook-popup

Illustrates how to use progressive enhancement to display the the Facebook login dialog in a popup window. State is kept during the OAuth 2.0 flow and used to close the window for requests using that display mode.

FAQ

How do I ask a user for additional permissions?

If you need additional permissions from the user, the permissions can be requested via the scope option to passport.authenticate().

app.get('/auth/facebook',
  passport.authenticate('facebook', { scope: ['user_friends', 'manage_pages'] }));

Refer to permissions with Facebook Login for further details.

How do I re-ask for for declined permissions?

Set the authType option to reauthenticate when authenticating.

app.get('/auth/facebook',
  passport.authenticate('facebook', { authType: 'reauthenticate', scope: ['user_friends', 'manage_pages'] }));

Refer to re-asking for declined permissions for further details.

How do I obtain a user profile with specific fields?

The Facebook profile contains a lot of information about a user. By default, not all the fields in a profile are returned. The fields needed by an application can be indicated by setting the profileFields option.

new FacebookStrategy({
  clientID: FACEBOOK_APP_ID,
  clientSecret: FACEBOOK_APP_SECRET,
  callbackURL: "http://localhost:3000/auth/facebook/callback",
  profileFields: ['id', 'displayName', 'photos', 'email']
}), ...)

Refer to the User section of the Graph API Reference for the complete set of available fields.

How do I include app secret proof in API requests?

Set the enableProof option when creating the strategy.

new FacebookStrategy({
  clientID: FACEBOOK_APP_ID,
  clientSecret: FACEBOOK_APP_SECRET,
  callbackURL: "http://localhost:3000/auth/facebook/callback",
  enableProof: true
}, ...)

As detailed in securing graph API requests, requiring the app secret for server API requests helps prevent use of tokens stolen by malicous software or man in the middle attacks.

Why is #_=_ appended to the redirect URI?

This behavior is "by design" according to Facebook's response to a bug filed regarding this issue.

Fragment identifiers are not supplied in requests made to a server, and as such this strategy is not aware that this behavior is exhibited and is not affected by it. If desired, this fragment can be removed on the client side. Refer to this discussion on Stack Overflow for recommendations on how to accomplish such removal.