I have an issue with not getting just flash message on my page, but getting json with an error instead of it:
However, if I click "back" in browser, I see the page as expected, with flash message on it
My request code:
const handleLogin = async (req, res) => {
const { errors, isValid } = validateLoginInput(req.body);
if (!isValid) {
return res.status(422).json(errors);
}
const { email, password } = req.body;
const user = await User.findOne({email});
if (!user) {
errors.email = AUTH_ERROR;
req.flash('loginMessage', AUTH_ERROR);
return res.status(404).json(errors);
}
const isMatch = user.validatePassword(password, user.password);
const { id, role } = user;
if (isMatch) {
const payload = {id, email, role};
jwt.sign(
payload,
config.JWTAuthKey,
{expiresIn: 3600},
(err, token) => {
res.cookie(tokenCookieName, token, { maxAge: 60 * 60 * 24 * 7 , httpOnly: false });
res.redirect('/');
}
);
} else {
errors.password = AUTH_ERROR;
req.flash('loginMessage', AUTH_ERROR);
return res.status(403).json(errors);
}
};
In addition, my passport config (I use jwt strategy)
const config = (passport) => {
passport.use(
new Strategy(opts, (jwt_payload, done) => {
User.findById(jwt_payload.id)
.then((user) => {
if (user) {
return done(null, user);
}
return done(null, false);
})
/*eslint no-console: ["error", { allow: ["warn", "error"] }] */
.catch(err => console.error(err));
}),
);
};
Any ideas would be highly appreciated, thank you un advance.
It turned out to be pretty easy. No need to send back status, just
return res.redirect('/')
will do the trick. One can redirect wherever is needed.
Related
I have been trying to set cookies in the browser from nodejs backend trough API with React
and it doesn't want to set them. It's not returning response and it doesn't give me any errors. Does this client.verifytoken function cause the issue? Can you please help?
Nodejs
export const googleAuth = async (req, res) => {
const {tokenId} = req.body
client.verifyIdToken({idToken: tokenId, audience: process.env.GOOGLE_CLIENT_ID}).then((response) => {
const {email_verified, name, email} = response.payload
console.log(response.payload)
if (email_verified) {
Users.findOne({where: {email: email}}).then(user => {
if (user) {
try {
const userId = user.id
console.log('user id', userId)
const refreshToken = jwt.sign({userId}, process.env.REFRESH_TOKEN_SECRET, {expiresIn: '1d'})
Users.update({refreshToken: refreshToken}, {where: {id: userId}})
res.cookie('refreshToken', refreshToken, {
httpOnly: false,
maxAge: 24 * 60 * 60 * 1000,
});
} catch (err) {
console.log(err)
}
} else {
try {
const salt = bcrypt.genSaltSync(2);
const hashPassword = bcrypt.hashSync(email + process.env.ACCESS_TOKEN_SECRET, salt);
const refreshToken = jwt.sign({email}, process.env.REFRESH_TOKEN_SECRET, {expiresIn: '1d'})
console.log('refresh token', refreshToken)
Users.create({
name: name,
email: email,
password: hashPassword,
refresh_token: refreshToken,
verified: true
})
res.cookie('refreshToken', refreshToken, {
httpOnly: true,
maxAge: 24 * 60 * 60 * 1000,
});
} catch (err) {
console.log(err)
}
}
})
}
})
}
Reactjs
const responseSuccessGoogle = async (response) => {
try {
console.log(response)
let result = await axios.post('http://localhost:5000/google-login', {tokenId: response.tokenId},{withCredentials:true})
setAuth(result.data != null)
navigate('/profile')
console.log(result.data)
} catch (error) {
console.log(error)
}
}
res.cookie() doesn't send the response, but only sets the cookie in response causing halt state in your case. You need to send response back either via res.send() or res.end(). You should also send a proper response with error code back to client instead of logging it only, as this would also halt the request. Following code should send response with empty body and send response with error code 500 in case of error.
export const googleAuth = async (req, res) => {
const {tokenId} = req.body
client.verifyIdToken({idToken: tokenId, audience: process.env.GOOGLE_CLIENT_ID}).then((response) => {
const {email_verified, name, email} = response.payload
console.log(response.payload)
if (email_verified) {
Users.findOne({where: {email: email}}).then(user => {
if (user) {
try {
const userId = user.id
console.log('user id', userId)
const refreshToken = jwt.sign({userId}, process.env.REFRESH_TOKEN_SECRET, {expiresIn: '1d'})
Users.update({refreshToken: refreshToken}, {where: {id: userId}})
res.cookie('refreshToken', refreshToken, {
httpOnly: false,
maxAge: 24 * 60 * 60 * 1000,
});
res.send();
} catch (err) {
console.log(err)
res.status(500).send()
}
} else {
try {
const salt = bcrypt.genSaltSync(2);
const hashPassword = bcrypt.hashSync(email + process.env.ACCESS_TOKEN_SECRET, salt);
const refreshToken = jwt.sign({email}, process.env.REFRESH_TOKEN_SECRET, {expiresIn: '1d'})
console.log('refresh token', refreshToken)
Users.create({
name: name,
email: email,
password: hashPassword,
refresh_token: refreshToken,
verified: true
})
res.cookie('refreshToken', refreshToken, {
httpOnly: true,
maxAge: 24 * 60 * 60 * 1000,
});
res.send();
} catch (err) {
console.log(err)
res.status(500).send()
}
}
})
}
})
}
I've implemented a /api/login to login a user. I also have a page login.js, that sends the form data to the login API. My login api checks the user credentials in my database and then signs a token and saves it to a cookie.
My /api/login:
await authCollection.findOne(
{
authCode: req.body.authcode,
},
function(err, doc) {
if (err) throw err;
if (!doc) return res.status(400).send('auth not found');
if (doc) {
const token = jwt.sign({ _id: doc._id }, process.env.TOKEN_SECRET);
res
.status(200)
.cookie('token', token, {
maxAge: 2 * 60 * 60 * 1000,
httpOnly: false,
})
.send(token);
}
},
);
I can protect my api routes with passing in a middleware like this:
function(req, res, next) {
const token = req.cookies.token || '';
if (!token) {
return res.status(401).send('Access denied');
}
try {
const decrypt = jwt.verify(token, process.env.TOKEN_SECRET);
req.user = {
id: decrypt.id,
firstname: decrypt._id,
};
next();
} catch (err) {
res.status(400).send('Invalid token');
}
}
I do not understand how I can protect normal pages, which are in my /pages directory. Could somebody give me a hint in the right direction? I have already googled and read each page, but couldn't implement
It depends, what I've done is to write an hoc privateArea which returns new component that fetches users accessToken from the API, then decodes it, if user is logged in, renders the wrapped page, otherwise, renders "restricted area" message.
export function privateArea(PageComponent) {
const PrivateArea = ({ accessToken, pageProps }) => {
const user = decodeToken(accessToken);
if (user) {
return <PageComponent {...pageProps} />;
} else {
return <RestrictedArea />;
}
};
PrivateArea.getInitialProps = async (...args) => {
const accessToken = await api.getAccessToken();
if (typeof PageComponent.getInitilProps === 'function') {
const pageProps = await PageComponent.getInitilProps(...args);
}
return {
accessToken,
pageProps: pageProps || {},
};
};
return PrivateArea;
}
I've successfully set up the registration and login functionality using Express, MongoDB and Mongoose.
I would like to log when the user last visited the site once the user's credential is accepted in a lastConnection property of the user document,
I tried but "lastConnection" is null (see the line below where I add a comment)
router.post("/login", async function(req, res) {
const { errors, isValid } = validateLoginInput(req.body);
if (!isValid) {
return res.status(400).json(errors);
}
const email = req.body.email;
const password = req.body.password;
const user = await User.findOne({ email }).then(user => {
if (!user) {
errors.email = "Email already exists";
}
console.log("user ", user); <-- returns an object with the datas of user
bcrypt.compare(password, user.password).then(isMatch => {
if (isMatch) {
const payload = {
id: user.id,
name: user.name
};
user.lastConnection = new Date(); <-- doesn't work
jwt.sign(
payload,
keys.secretOrKey,
{
expiresIn: 7200
},
(err, token) => {
res.json({
success: true,
token: "Bearer " + token
});
}
);
} else {
errors.password = "Password is not correct";
// return res
// .status(400)
// .json({ passwordincorrect: "Password incorrect" });
}
});
});
return {
errors,
isValid: isEmpty(errors)
};
});
Any ideas? I think I have to do an update but I don't know where to put it
Try replacing user.lastConnection = new Date(); with
user.update({ lastConnection: new Date() })
.then( updatedUser => {
console.log(updatedUser)
// put jwt.sign code here
})
I'm trying to use koa-passport for koa2, and followed the examples of the author, but i always get "Unauthorized". I used the console.log and found that it even not hit the serializeUser.
var UserLogin = async (ctx, next) =>{
return passport.authenticate('local', function(err, user, info, status) {
if (user === false) {
ctx.body = { success: false }
} else {
ctx.body = { success: true }
return ctx.login(user)
}
})(ctx, next);
};
And then I searched on the web and found another writing of router, it goes to the serializeUser but the done(null, user.id) threw error that "cannot get id from undefined".
let middleware = passport.authenticate('local', async(user, info) => {
if (user === false) {
ctx.status = 401;
} else {
await ctx.login(ctx.user, function(err){
console.log("Error:\n- " + err);
})
ctx.body = { user: user }
}
});
await middleware.call(this, ctx, next)
The auth.js are showed below. Also I followed koa-passport example from the author here and tried to use session, but every request i sent will get a TypeError said "Cannot read property 'message' of undefined". But I think this is not the core problem of authentication, but for reference if that really is.
const passport = require('koa-passport')
const fetchUser = (() => {
const user = { id: 1, username: 'name', password: 'pass', isAdmin: 'false' };
return async function() {
return user
}
})()
const LocalStrategy = require('passport-local').Strategy
passport.use(new LocalStrategy(function(username, password, done) {
fetchUser()
.then(user => {
if (username === user.username && password === user.password) {
done(null, user)
} else {
done(null, false)
}
})
.catch(err => done(err))
}))
passport.serializeUser(function(user, done) {
done(null, user.id)
})
passport.deserializeUser(async function(id, done) {
try {
const user = await fetchUser();
done(null, user)
} catch(err) {
done(err)
}
})
module.exports = passport;
By the way when I use the simple default one, it will just give me a "Not found". But through console.log I can see it actually got into the loginPass.
var loginPass = async (ctx, next) =>{
passport.authenticate('local', {
successRedirect: '/myApp',
failureRedirect: '/'
});
};
In server.js:
// Sessions
const convert = require('koa-convert');
const session = require('koa-generic-session');
app.keys = ['mySecret'];
app.use(convert(session()));
// authentication
passport = require('./auth');
app.use(passport.initialize());
app.use(passport.session());
Thanks a lot for any help!!! :D
I'm using Passport for authentication, specifically with a JWT strategy. I'm able to create a new token when a user is created, however, when I use that token in the header of a request to a route that requires authentication, my request just hangs up. I'm using Postman to test these POST/GET requests.
Here's my initial configuration for signing up a user:
const User = require('../db/models/User');
const jwt = require('jsonwebtoken');
function userToken(user) {
return jwt.sign({
id: user.id,
}, process.env.JWT_SECRET);
}
exports.signup = function(req, res, next) {
const email = req.body.email.toLowerCase();
const password = req.body.password.toLowerCase();
User.findOne({
where: { email },
}).then(function(user) {
if (!user) {
User.create({
email,
password,
})
.then(function(user) {
return res.send({ token: userToken(user) });
});
}
if (user) {
return res.send({ message: 'That user is in use' });
}
});
};
Here's my passport configuration:
const passport = require('passport');
const JwtStrategy = require('passport-jwt').Strategy;
const ExtractJwt = require('passport-jwt').ExtractJwt;
const User = require('../db/models/User');
const jwtOptions = {
jwtFromRequest: ExtractJwt.fromHeader('authorization'),
secretOrKey: process.env.JWT_SECRET,
};
const jwtLogin = new JwtStrategy(jwtOptions, function(payload, done) {
User.findOne({
where: { id: payload.id },
}, function(err, user) {
if (err) { return done(err, false); }
if (user) { return done(null, user); }
return done(null, false);
});
});
passport.use(jwtLogin);
Here's what my protected route looks like:
const passport = require('passport');
const requireAuth = passport.authenticate('jwt', { session: false });
module.exports = function router(app) {
app.get('/', requireAuth, function(req, res) {
res.send({ 'hi': 'there' });
});
};
Here's what I see in my terminal:
Executing (default): SELECT "id", "username", "email", "password", "photo", "createdAt", "updatedAt" FROM "users" AS "user" WHERE "user"."id" = 15;
So I know that it's correctly querying for a user id and searching for it, however, it just hangs up at this point, rather than serving me a response.
Not sure what the issue is, so any and all suggestions are welcomed and appreciated. Thank you!
Realized that because I am using Sequelize, it handles errors with a catch like so:
...
const jwtLogin = new JwtStrategy(jwtOptions, function(payload, done) {
User.findOne({
where: { id: payload.id }
})
.then(user => {
if (user) {
done(null, user);
} else {
done(null, false);
}
})
.catch(err => {
if (err) { return done(err, false); }
});
});
...
This solved my issue and is returning my response.