I am currently learning about passport.js and session management, and I'm in the process of implementing a local login feature on my website.
Here is what I am attempting to achieve:
- Secret page: Authenticated users can access the secret page, while unauthorized users will be redirected to the login page.
- Login page: Users who enter correct username and password details are authenticated and transferred to the secret page; otherwise, they are sent back to the login page.
- Register page: Users provide a username and password, a new MongoDB document is created and stored in the database. Simultaneously, the user is authenticated for the current session and forwarded to the secret page.
The Issue I'm Facing:
- Login page authentication works fine: The authentication process on the login page functions correctly. A cookie is sent to the browser upon successful login, and the user is authenticated within the session to access the secret page.
- Register page data insertion is successful: After registration, the new username and password are saved in the MongoDB database. Users can log in using this newly registered account.
- Register page authentication failure: Despite utilizing the same passport.authenticate() function, the register page encounters an issue with the authentication process. However, no error messages are displayed in the console.
After researching and attempting various passport authentication methods found on Google, they all worked well for the 'login' POST Request but not for the 'register' POST Request. I have gone through the documentation of passport-local and passport-local-mongoose, as well as tried out this solution. Unfortunately, I still encounter authentication issues on the register page despite following these resources. I am utilizing express-session, passport, and passport-local-mongoose packages.
I'm beginning to question if there is a gap in my understanding of passport authentication? Thank you for your assistance and patience!
My Code:
EJS File - Register Page:
<!-- ... -->
<form action="/register" method="POST">
<div class="form-group">
<label for="email">Email</label>
<input type="email" class="form-control" name="username">
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" name="password">
</div>
<button type="submit" class="btn btn-dark">Register</button>
</form>
<!-- ... -->
JS File:
require('dotenv').config();
const express = require('express');
const app = express();
const port = 3000;
const ejs = require('ejs');
const session = require('express-session');
const passport = require('passport');
const passportLocalMongoose = require('passport-local-mongoose')
app.use(express.urlencoded({
extended: true
}));
app.use(express.static("public"));
app.set("view engine", "ejs");
//session and passport set up
app.use(session({
secret: process.env.SECRET,
resave: false,
saveUninitialized: true,
cookie: {
sameSite: 'lax'
},
}))
app.use(passport.initialize());
app.use(passport.session());
//user database set up ////////
const mongoose = require("mongoose");
main().catch(err => console.log(err));
async function main() {
await mongoose.connect('mongodb://localhost:27017/userDB');
}
const userSchema = new mongoose.Schema({
username: {
type: String,
unique: true
},
password: String
})
userSchema.plugin(passportLocalMongoose)
const User = mongoose.model("User", userSchema)
passport.use(User.createStrategy());
passport.serializeUser(User.serializeUser());
passport.deserializeUser(User.deserializeUser());
//user database set up end ///////
//GET Request
app.get("/", function(req, res) {
res.render("home");
})
app.get("/login", function(req, res) {
res.render("login");
})
app.get("/register", function(req, res) {
res.render("register");
})
//Secret Page ////////////////////////////////
app.get("/secrets", function(req, res) {
if (req.isAuthenticated()) {
res.render("secrets")
} else(
res.redirect("/login")
)
})
app.get('/logout', function(req, res) {
req.logout(function(err) {
if (err) {
console.log(err);
}
res.redirect('/');
});
});
//POST request
//Register POST Request ////////////////////////////////
app.post("/register", function(req, res) {
User.register(new User({
username: req.body.username
}), req.body.password,
function(err, user) {
if (err) {
console.log(err);
res.redirect('/register')
}
passport.authenticate('local'), function(req, res) {
res.redirect("/secrets");
}
}
)
})
app.post('/login', passport.authenticate('local', {
failureRedirect: '/login',
}), function(req, res) {
res.redirect("/secrets");
});
app.listen(port, function() {
console.log("start listening to port 3000")
})