这里我们以用户登录鉴权为例
express依赖express-session中间件实现session功能
若我们不加载express-session组件
router.get(\'/user/login\', function (req, res) {
console.log(req,req.session)
})
会发现不存在session对象
引入express-session组件
// server/index.js文件 ... import session from \'express-session\' ... app.use(session) ...
然后再试试
router.get(\'/user/login\', function (req, res) {
console.log(req.session)
})
这时可以看到打印出空数组对象。。。好了,下面就可以使用了
import {Router} from \'express\'
const router = Router()
import request from \'superagent\'
router.get(\'/user/login\', function (req, res) {
request
.get(path)
.query(req.query)
.set(\'Content-Type\', \'application/json;charset=UTF-8\')
.end((err, _res) => {
if (_res.body.code === 200) {
req.session.authUser = _res.body.data //将返回的用户数据存到session
}
res.json(_res.body)
})
}
seeesion搞定了,怎么进行鉴权呢?
首先,将用户session保存到store,以便全局取用
nuxtServerInit 方法:如果在状态树中指定了 nuxtServerInit 方法,Nuxt.js 调用它的时候会将页面的上下文对象作为第2个参数传给它(服务端调用时才会酱紫哟)。当我们想将服务端的一些数据传到客户端时,这个方法是灰常好用的。
举个例子,假设我们服务端的会话状态树里可以通过 req.session.user 来访问当前登录的用户。将该登录用户信息传给客户端的状态树,我们只需更新 store/index.js 如下:
actions: {
nuxtServerInit ({ commit }, { req }) {
if (req.session.user) {
commit(\'user\', req.session.user)
}
}
}
这样我们就可以通过判断store中user的状态来知道用户是否登录。
在跳转时需要鉴权的页面添加中间件:
export default{
middleware: auth
}
auth.js
export default function ({store,redirect}) {
if (!store.state.authUser) {
return redirect(\'/user/login\')
}
}
大概流程:a?>b middleware鉴权未登录,跳转登录页面登录,调用登录接口保存用户session,返回a,再次跳转b,nuxtServerInit 从上下文对象中获取session保存在store,鉴权成功,跳转成功。
拓展:connect-redis
sever/index配置
import express from \'express\'
import {
Nuxt,
Builder
} from \'nuxt\'
import session from \'express-session\'
import redis from \'connect-redis\'
import bodyParser from \'body-parser\'
import api from \'./api\'
import serverConfig from \'./config\' //redis配置文件
const app = express()
const host = process.env.HOST || \'127.0.0.1\'
const port = process.env.PORT || 3000
const RedisStore = redis(session)
app.use(bodyParser.json())
app.use(\'/static\', express.static(\'static\'))
app.use(session({
name: \'sid\',
secret: \'Asecret123-\',
resave: true,
rolling: true,
saveUninitialized: false,
store: new RedisStore(serverConfig)
}))
app.set(\'port\', port)
// Import API Routes
app.use(\'/api\', api)
app.use(\'/\', api)
// Import and Set Nuxt.js options
let config = require(\'../nuxt.config.js\')
config.dev = !(process.env.NODE_ENV === \'production\')
// Init Nuxt.js
const nuxt = new Nuxt(config)
// Build only in dev mode
if (config.dev) {
const builder = new Builder(nuxt)
builder.build()
}
// Give nuxt middleware to express
app.use(nuxt.render)
// Listen the server
app.listen(port, host)
console.log(\'Server listening on \' + host + \':\' + port) // eslint-disable-line no-console
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
继续阅读与本文标签相同的文章
上一篇 :
阿里云云盾-智能风控(公测)发布
-
《21天学通JavaScript(第5版)》| 每日读本书
2026-05-19栏目: 教程
-
Unity火爆插件Behavior Designer行为树插件学习
2026-05-19栏目: 教程
-
结合 Mybatis,探讨 Oracle 中 in 与 not in 的陷阱
2026-05-19栏目: 教程
-
阿里云文件网关备份
2026-05-19栏目: 教程
-
UITableView 组件化
2026-05-19栏目: 教程
