0

I tried to implement authentication using Vue.js(Single page application) for client, passport.js and express.js for server side. This is the first time for me to try authentication using single page application, so I'm stuck with implementing it.

My question is how to make "passport.deserializeUser()" work. It seems like passport.serializeUser is working, but deserializeUser is not. The reason for that is that deserializeUser works when new html page is called. But because vue.js is single page application, deserialiseUser is not working.

I think I can make authentication possible with JWT, but I would like to achieve authentication without using JWT. So If anyone can help me out with how to make "passport.deserializeUser()" work, I really appreciate it. Besides that if you know the best practice of authentication practice in this situation, please let me know.

const session = require('express-session');
const passport = require('passport');
const LocalStrategy = require('passport-local');
app.use(session({
    secret: 'keyboardcat',
    resave: false,
    saveUninitialized: true,
    cookie: {
        maxAge: 1000 * 60 * 60 * 24,
    }
}))
mongoose.connect("mongodb://mongodb:27017", {
    useNewUrlParser: true,
    useUnifiedTopology: true,
    user: "root",
    pass: "password",
    dbName: "videoUserDB",
});

const userSchema = new mongoose.Schema({
    username: String,
    password: String,
});
const User = new mongoose.model("User", userSchema);

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

passport.deserializeUser(function (id, done) {
    console.log("deserializeUser");
    User.findById(id, function (err, user) {
        if (err) {
            console.log(err);
            done(error, null);
        } else {
            console.log(user);
            done(null, user);
        }
    });
});

Local Strategy is working properly.

passport.use(new LocalStrategy(
    function (username, password, done) {
        User.findOne({ username: username }, function (err, foundUser) {
            if (err) {
                console.log(err);
            }
            else {
                if (foundUser) {
                    console.log("found User is working");
                    console.log("founduser pass", foundUser.password);

                    if (foundUser.password === md5(password)) {
                        done(null, foundUser);
                    }
                    else {
                        return done(null, false, { message: "Invalid User" });
                    }
                }
                else {
                    return done(null, false, { message: "Invalid User" });
                }
            }
        });
    }
))
app.use(passport.initialize());
app.use(passport.session());
app.get("/login", function (req, res) {
    console.log("req.session is here", req.session)
    const userId = req.session.userid;
    const isAuth = Boolean(userId);
    res.send({ title: "Sign in", isAuth: isAuth })
});

This req.session shows what session sent from browser has, and it shows req.session is here Session {cookie: {path: '/',_expires: 2022-11-27T07:19:43.700Z,originalMaxAge: 86400000,httpOnly: true}}

Also, on browser, this isAuth is false.

app.post('/login', passport.authenticate('local', {
    failureFlash: true,
}), function (req, res) {

    let resUser = {
        validation: true,
    }

    res.send(resUser);
})

This post request is working properly.

Probably, if I can keep user.id information in session and make it stored in cookie, and if cookie is deserialized when get request to (/login) is sent, this might work. Sorry, I couldn't wrap my head around this logic, but any advice will be appreciated.

Login function with username and password works. However login with session is not working. Probably the reason is deserialization is not working or necessary information is not stored in session.

Thank you.

0 Answers0