Error with Facebook redirect URL on login/register using passport on a node.js (MEAN stack) application - node.js

I am implementing the Facebook login and register functions to my application, and can reach facebook for the user to enter their information, but can't make the callback work. I have input the code below into passport.js (obviously x'ing out our information):
passport.use(new FacebookStrategy({
clientID: "xxxxxxxxxxxxxx",
clientSecret: "xxxxxxxxxxxxxxxxxxx",
callbackURL: "https://xxxxxxxxxxxxxxxx/auth/facebook/callback/",
enableProof: false,
profileFields: ['id', 'displayName', 'photos']
},
function (accessToken, refreshToken, profile, done) {
process.nextTick(function () {
User.findOne({facebookId: profile.id}, function (err, user) {
if (err) {
return done(err);
}
if (user) {
return done(null, user);
} else {
var data = {
facebookId: profile.id,
f_name: profile.first_name,
l_name: profile.last_name,
username: profile.email
};
if (profile.emails && profile.emails[0] && profile.emails[0].value) {
data.username = profile.emails[0].value;
}
User.create(data, function (err, user) {
return done(err, user);
});
}
});
});
}));
passport.serializeUser(function(user, callback) {
callback(null, user._id);
});
passport.deserializeUser(function(id, done) {
User.findById({
_id: id
}, function(err, user) {
callback(err, user);
});
});
passport.use(new LocalStrategy(
function (username, password, done) {
console.log(username);
console.log(password);
User.findOne({ 'username': username }, function (err, user) {
// if (err) { return done(err); }
if (!user) {
return done(null, false, { message: 'Incorrect email.' });
}
if (!user.validPassword(password)) {
return done(null, false, { message: 'Incorrect password.' });
}
return done(null, user);
});
}
));
The following callback URL has been included in index.js:
router.get('/auth/facebook', passport.authenticate('facebook', {
scope: 'email' }));
router.get('/auth/facebook/callback',
passport.authenticate('facebook', {
successRedirect : '/user/#/home',
failureRedirect : '/'
}));
I am able to make the application direct to the Facebook login page onClick, but once the user enters their email and password into facebook, the application is unable to reload on redirect and get the person to our homepage. The redirect begins to happen, but hits an error once it tries to load our application. Could we be utilizing one of the redirect fields incorrectly? As a side note, what should we set as a valid OAuth Redirect URI on the facebook developer application page?

Related

Passport.js not sending req.user object while redirecting

I'm trying to build an authentication system with passport-local. I got the initial starter code from here: https://www.digitalocean.com/community/tutorials/easy-node-authentication-setup-and-local#toc-handling-signupregistration
When I try console.log(req.user), it gets logged successfully, meaning that passport does return req.user.
However, when redirecting to the logged-in route, req.user becomes undefined. How can I get req.user to be sent to my logged-in route?
Here is my code.
Frontend request:
const serverResponse = fetch('http://localhost:5000/api/client/signin', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(x)
})
.then((res)=> {
if (res.user) {
alert('Sign in successful.')
return res.user
} else {
alert('Try again.')
}})
.catch((err)=> {
alert(`Error: ${err}`)
})
Backend sign-in route:
router.post('/signin', passport.authenticate('local-login', {
successRedirect: '/api/client/profile',
failureRedirect: '/api/client/signin',
failureFlash: true
}))
Passport js login config file:
passport.use('local-login', new LocalStrategy({
usernameField: 'email',
passwordField: 'password',
passReqToCallback: true // allows us to pass back the entire request to the callback
},
function(req, email, password, done) {
// find a user whose email is the same as the forms email
UserModel.findOne({
email: req.body.email
}, function(err,
user) {
// if there are any errors,
if (err)
return done(err);
// if no user is found,
if (!user) {
console.log('That account does not exist!')
return done(null, false, req.flash('loginMessage', 'No user found.'));
}
// if the password is wrong
if (user.password != password) {
console.log('Wrong password!')
return done(null, false, req.flash('loginMessage', 'Oops! Wrong password.'));
}
// all is well, return successful user
return done(null, user);
});
}));
Logged-in check
function loggedIn(req, res, next) {
if (req.user) {
console.log(`User: found.`)
return next();
} else {
console.log('No user object.')
}
}
Finally, logged-in route
router.get('/profile', loggedIn, (req, res) => {
console.log('User logged in.')
console.log(`${req.user}`)
res.send(req.user)
})

Passport.js positive result

I am attempting to authenticate a user in a Node app using Sequelize and Passport. I am able to hit my database but can't seem to get a positive result. Basically, I have a simple frontend form that accepts a username and password (using the respective names "username" and "password") and then the following Passport definition:
passport.use(new localStrategy(
{usernameField: 'email'},
function(req, email, password, done) {
models.TeacherX.findOne({ email: email }, function (err, user) {
if (err) { return done(err); }
if (!user) { return done(null, false); }
if (!user.verifyPassword(password)) { return done(null, false); }
return done(null, user);
});
}
));
Then I call it with:
router.post('/login',
passport.authenticate('local', { failureRedirect: '/login?msg=failure'}),
function(req, res) {
res.redirect("/?msg=positive");
});
Since you are passing the request to the verify callback, you need to set the property passReqToCallback to true or remove the req param from the verify callback. Try this:
passport.use(new localStrategy(
{passReqToCallback: true ,
usernameField: 'email'},
function(req, email, password, done) {
models.TeacherX.findOne({ email: email }, function (err, user) {
if (err) { return done(err); }
if (!user) { return done(null, false); }
if (!user.verifyPassword(password)) { return done(null, false); }
return done(null, user);
});
}
));

Failed to serialize user into session when using passport-facebook strategy with passport-local

I am using passport-local and passport-facebook strategies for authentication in sails.js. Authentication with email is working fine. But when user authenticates using facebook, I am getting this error message [Error: Failed to serialize user into session].
Then I tested serializeUser method and it turns out user param is empty in case of facebook. While I also tried to see if verifyHandler is called or not and it is not being called.
Here is my code for the facebook authentication action:
facebook: function (req, res) {
passport.authenticate('facebook', {failureRedirect: '/login', scope: ['email']}, function (err, user) {
if ((err) || (!user)) {
req.session.flash = {
errMsg: 'Email or password mismatch.'
}
return res.redirect('/login');
}
req.logIn(user, function (err) {
if (err) {
console.log(err);
res.view('500');
return;
}
res.redirect('/');
return;
});
})(req, res);
}
And this is the code of passport.js service (api/services/passport.js)
var passport = require('passport'),
LocalStrategy = require('passport-local').Strategy,
FacebookStrategy = require('passport-facebook').Strategy,
bcrypt = require('bcrypt');
var verifyHandler = function (token, tokenSecret, profile, done) {
console.log('in verifyHandler'); // this line is not being executed.
console.log(profile);
process.nextTick(function () {
User.findOne({uid: profile.id}, function (err, user) {
if (err) {
return done(err);
}
if (user) {
return done(null, user);
} else {
var data = {
provider: profile.provider,
uid: profile.id,
name: profile.displayName
};
if (profile.emails && profile.emails[0] && profile.emails[0].value) {
data.email = profile.emails[0].value;
}
User.create(data, function (err, user) {
return done(err, user);
});
}
});
});
};
passport.serializeUser(function (user, done) {
done(null, user.id);
});
passport.deserializeUser(function (id, done) {
User.findById(id, function (err, user) {
done(err, user);
});
});
passport.use(new LocalStrategy({
usernameField: 'email',
passwordField: 'password'
},
function (email, password, done) {
User.findOne({email: email}).exec(function (err, user) {
if (err) {
return done(err);
}
if (!user) {
return done(null, false, {message: 'Unknown user ' + email});
}
bcrypt.compare(password, user.password, function (err, res) {
if (!res) return done(null, false, {message: 'Invalid Password'});
return done(null, user);
});
});
}
));
passport.use(new FacebookStrategy({
clientID: sails.config.facebook.clientID,
clientSecret: sails.config.facebook.clientSecret,
callbackURL: sails.config.facebook.callbackURL
}, verifyHandler));
And finally (config/passport.js)
var passport = require('passport'),
LocalStrategy = require('passport-local').Strategy,
FacebookStrategy = require('passport-facebook').Strategy;
module.exports = {
http: {
customMiddleware: function (app) {
app.use(passport.initialize());
app.use(passport.session());
}
}
};
Any thoughts?
Check if user.id is defined and it is string but not ObjectId().
in
passport.serializeUser(function (user, done) {
done(null, user.id);
});

How to differentiate Login from Sign up when using PassportJS for Facebook

I am trying to set up goals on Google Analytics to track Sign Ups, so I set up a 'thank you ' page as my url goal. It works well when my users sign up with their email address but not when they use facebook to sign up/login. When they login, they are redirected to the thank you page as there is only one url callback when setting up Facebook using Passport JS and Node.
Here is my code:
passport.serializeUser(function(user, done) {
done(null, user);
});
passport.deserializeUser(function(id, done) {
UserActivity.findOne(id,'uid ref', function (err, user) {
done(err, user);
});
});
passport.use(new FacebookStrategy({
clientID: 'XXXXXXXXXXXX',
clientSecret: 'XXXXXXXXXXXXXXXX',
callbackURL: "https://www.xxxxxxx.com/auth/facebook/callback"
},
function(accessToken, refreshToken, profile, done) {
//console.log(profile);
User.findOne({ uid: profile.id }, function(err, uInfo) {
if(err) console.log('Error: '+err);
else{
//User exists: we are done
if(uInfo){
done(err, uInfo);
}
else{
//User doesn't exist: we create a new one
var newUser = new User ({
uid: profile.id,
email:profile.emails[0].value,
ref: 'Facebook'
});
// Saving it to the database.
newUser.save(function (err,uInfo) {
if (err) console.log ('Error on save!');
done(err, uInfo);
});
}
}
})
}
));
app.get('/auth/facebook', passport.authenticate('facebook',{ scope: 'email' }));
app.get('/auth/facebook/callback',
passport.authenticate('facebook', { successRedirect: '/thankyou',
failureRedirect: '/login' }));
If the user exists, I would like to redirect to their dashboard ('/dashboard) and if they are new users, I need to redirect them to /thankyou.
Any idea how to achieve this?
Thanks a lot!
Nevermind, found the answer. Here is the updated code below. Pay attention to the use of passReqToCallback and req.session.newu
passport.use(new FacebookStrategy(
{
clientID: 'XXX',
clientSecret: 'XXX',
callbackURL: "https://www.XXX.co/auth/facebook/callback",
passReqToCallback: true
},
function(req, accessToken, refreshToken, profile, done) {
//console.log(profile);
User.findOne({ uid: profile.id }, function(err, uInfo) {
if(err) console.log('Error: '+err);
else{
if(uInfo){
done(err, uInfo);
}
else{
var newUser = new User ({
uid: profile.id,
email:profile.emails[0].value,
ref: 'Facebook'
});
// Saving it to the database.
newUser.save(function (err,uInfo) {
if (err) console.log ('Error on save!');
req.session.newu=true;
done(err, uInfo);
});
}
}
})
}
));
app.get('/auth/facebook', passport.authenticate('facebook',{ scope: 'email' }));
app.get('/auth/facebook/callback',function(req, res, next) {
passport.authenticate('facebook', function(err, user, info) {
if (err) { return next(err); }
if (!user) { return res.redirect('/login'); }
req.logIn(user, function(err) {
if (err) { return next(err); }
var redLink = '/dashboard';
if(req.session.newu)redLink = '/dashboard?newu'
return res.redirect(redLink);
});
})(req, res, next);
});
An existing user will be redirected to /dashboard and a new user will be redirected to /dashboard?newu
Google Analytics doesn't need 2 different urls, it just needs a query string. When I set up the url goal, I selected url start with /dashboard?newu.
Hope this helps
The question is a bit old but it might still help someone like me. The OP's answer works but it means you have to take care of log-in user and session, etc. In case you still want to leave those work to PassportJS, use req.session.returnTo in strategy's callback with successReturnToOrRedirect option in passport.authenticate() would work.

Using PassportJS, how does one pass additional form fields to the local authentication strategy?

I'm using passportJS and I'm wanting to supply more than just req.body.username and req.body.password to my authentication strategy (passport-local).
I have 3 form fields: username, password, & foo
How do I go about accessing req.body.foo from my local strategy which looks like:
passport.use(new LocalStrategy(
{usernameField: 'email'},
function(email, password, done) {
User.findOne({ email: email }, function(err, user) {
if (err) { return done(err); }
if (!user) {
return done(null, false, { message: 'Unknown user' });
}
if (password != 1212) {
return done(null, false, { message: 'Invalid password' });
}
console.log('I just wanna see foo! ' + req.body.foo); // this fails!
return done(null, user, aToken);
});
}
));
I'm calling this inside my route (not as route middleware) like so:
app.post('/api/auth', function(req, res, next) {
passport.authenticate('local', {session:false}, function(err, user, token_record) {
if (err) { return next(err) }
res.json({access_token:token_record.access_token});
})(req, res, next);
});
There's a passReqToCallback option that you can enable, like so:
passport.use(new LocalStrategy(
{usernameField: 'email', passReqToCallback: true},
function(req, email, password, done) {
// now you can check req.body.foo
}
));
When, set req becomes the first argument to the verify callback, and you can inspect it as you wish.
In most common cases we need to provide 2 options for login
with email
with mobile
Its simple , we can take common filed username and query $or by two options , i posted following snippets,if some one have have same question .
We can also use 'passReqToCallback' is best option too , thanks #Jared Hanson
passport.use(new LocalStrategy({
usernameField: 'username', passReqToCallback: true
}, async (req, username, password, done) => {
try {
//find user with email or mobile
const user = await Users.findOne({ $or: [{ email: username }, { mobile: username }] });
//if not handle it
if (!user) {
return done(null, {
status: false,
message: "That e-mail address or mobile doesn't have an associated user account. Are you sure you've registered?"
});
}
//match password
const isMatch = await user.isValidPassword(password);
debugger
if (!isMatch) {
return done(null, {
status: false,
message: "Invalid username and password."
})
}
//otherwise return user
done(null, {
status: true,
data: user
});
} catch (error) {
done(error, {
status: false,
message: error
});
}
}));

Resources