Saturday, 22 April 2017

Retrieving user's Facebook profile image through passport-facebook

I'm implementing both a local a Facebook strategy for my app. I have my basic Facebook sign-up working and the user's details are being correctly stored to my mongodb database. However, I now want to be able to retrieve and use the user's profile picture from Facebook but I don't know where to start with this.

Here's my Facebook strategy:

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

    var User = require('../models/user');

    var configAuth = require('./auth');

    module.exports = function(passport) {

    passport.serializeUser(function(user, done) {
        done(null, user.id);
    });

    passport.deserializeUser(function(id, done) {
        User.findById(id, function(err, user) {
            done(err, user);
        });
    });

    // FACEBOOK

    // pull in app id and secret from our auth.js file
    passport.use(new FacebookStrategy({
        clientID            : configAuth.facebookAuth.clientID,
        clientSecret        : configAuth.facebookAuth.clientSecret,
        callbackURL         : configAuth.facebookAuth.callbackURL,
        profileFields       : configAuth.facebookAuth.profileFields
    },

    function(token, refreshToken, profile, done) {

        process.nextTick(function() {

            User.findOne({ 'facebook.id' : profile.id }, function(err, user) {

                if(err)
                    return done(err);

                if(user) {
                    return done(null, user); 
                } else {
                    var newUser   = new User();

                    newUser.facebook.id  = profile.id;
                    newUser.facebook.token = token;
                    newUser.facebook.name  = profile.name.givenName + ' ' + profile.name.familyName;
                    newUser.facebook.email = profile.emails[0].value;

                    newUser.save(function(err) {
                        if(err)
                            throw err;
                        return done(null, newUser);
                    });
                }
            });

        });
    }));
};

Here's my FB authentication:

module.exports = {

    'facebookAuth' : {
        'clientID'      : '1609976625696971',
        'clientSecret'  : 'a253f38199a8a0a8418518545766693c',
        'callbackURL'   : 'http://localhost:8080/auth/facebook/callback',
        'profileFields' : ["emails", "displayName", "name", "photos"]
    }
};

And the routes for signup:

app.get('/auth/facebook', passport.authenticate('facebook', { scope : 'email'}));

app.get('/auth/facebook/callback',
passport.authenticate('facebook', {
successRedirect : '/profile',
failureRedirect : '/signup'
}));

I've done some research on the subject and see a lot of talk about Facebook's graph API - I visited the developer site for FB and tried to follow the guide on using this but in all honesty, I don't know where to begin. Any help would be much appreciated!



via DaveB1

No comments:

Post a Comment