我正在使用official NuxtJS Auth Routes example通过express-sessions登录,效果很好
app.js文件
const express = require('express')
const session = require('express-session')
const app = express()
app.use(express.json())
app.use(express.urlencoded({ extended: true }))
// session middleware
app.use(
session({
secret: 'super-secret-key',resave: false,saveUninitialized: false,cookie: { maxAge: 60000 }
})
)
// Create express router
const router = express.Router()
// Transform req & res to have the same API as express
// So we can use res.status() & res.json()
router.use((req,res,next) => {
Object.setPrototypeOf(req,app.request)
Object.setPrototypeOf(res,app.response)
req.res = res
res.req = req
next()
})
// Add POST - /api/login
router.post('/login',(req,res) => {
if (req.body.username === 'demo' && req.body.password === 'demo') {
req.session.authUser = { username: 'demo' }
return res.json({ username: 'demo' })
}
res.status(401).json({ message: 'Bad credentials' })
})
// Add POST - /api/logout
router.post('/logout',res) => {
delete req.session.authUser
res.json({ ok: true })
})
app.use('/api',router)
module.exports = app
问题是cookie过期时,用户仍在前端登录。如果他们访问终结点计算机,则它们会注销,因为我猜测将调用nuxtServerInit来取消用户身份设置
store / index.js
import axios from 'axios'
export const state = () => ({
authUser: null
})
export const mutations = {
SET_USER(state,user) {
state.authUser = user
}
}
export const actions = {
// nuxtServerInit is called by Nuxt.js before server-rendering every page
nuxtServerInit({ commit },{ req }) {
if (req.session && req.session.authUser) {
commit('SET_USER',req.session.authUser)
}
},async login({ commit },{ username,password }) {
try {
const { data } = await axios.post('/api/login',password })
commit('SET_USER',data)
} catch (error) {
if (error.response && error.response.status === 401) {
throw new Error('Bad credentials')
}
throw error
}
},async logout({ commit }) {
await axios.post('/api/logout')
commit('SET_USER',null)
}
}