0

So i am using passport local mongoose for authentication purposes and vuejs for frontend.what i had to do always is store the user info in localstorage and then access that user in express by req.body.user whie what i want to achieve is req.user. Can someone help me what should i include so that req.user will no longer be undefined.. I am new to vue.

this is configuration from app.js

const app = express();
app.use(morgan("combined"));
//app.use(cors(corsOption));
const allowCrossDomain = function(req, res, next) {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Methods', '*');
  res.header('Access-Control-Allow-Headers', '*');
  next();
}
app.use(allowCrossDomain)
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());
app.use(cookieParser('form based'));
app.use(require('express-session')({
  secret: 'form based',
  resave: false,
  saveUninitialized: false,
}))
// app.use(
//   cookieSession({
//     maxAge: 24 * 60 * 60 * 1000,
//     keys: ["qwefgfds"]
//   })
// );
app.use(passport.initialize())
app.use(passport.session())
passport.use('local',new passportLocal(Client.authenticate()))
passport.serializeUser(Client.serializeUser())
passport.deserializeUser(Client.deserializeUser())

This is what i am doing when logging in..

methods: {
    async login() {
      const response = await AuthenticationService.login({
        username: this.username,
        password: this.password
      });
      console.log("logininfo", response.data);
      this.res = response.data.msg;
      if (response.data.status == 200) {
        let userID = response.data.userID;
        //console.log(userID, response.data.userID);
        localStorage.setItem("user", JSON.stringify(response.data.user));
        console.log(
          "from localstorage",
          JSON.parse(localStorage.getItem("user"))
        );
        this.$store.dispatch("setUser", response.data.user);
        router.push({ name: "HelloWorld", query: { userID: userID } });
      }
    }
  }

This is the store.js

import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
import createPersistedState from "vuex-persistedstate";
Vue.use(Vuex)

export default new Vuex.Store({
  strict: true,
  plugins: [createPersistedState({
    storage: window.sessionStorage,
  })],
  state: {
    user: JSON.parse(localStorage.getItem('user')) || null,
    isUserLoggedIn: false
  },
  mutations: {
    setUser (state, user) {
      state.user = user
      if (user) {
        //localStorage.setItem('user',user);
        state.isUserLoggedIn = true
      } else {
        state.isUserLoggedIn = false
      }
    }
  },
  actions: {
    setUser ({commit}, user) {
      console.log('commited',user);
      axios.defaults.headers.common['Authorization'] = user;
      commit('setUser', user);
    }
  }
})

I am trying to achieve this from so long, i hope someone helps. Thanks a lot in advance.

Phil
  • 157,677
  • 23
  • 242
  • 245

0 Answers0