sessio 与 cookie:
基于HTTP协议,HTTP是一种无状态的协议
-
为什么有session与cookie
web 1.0:资源共享,
web 2.0: 交互,多部操作,依赖数据
session与cookie:来实现状态的记录,解决Http无状态的缺陷。 -
session和cookie的区别和特点:
- session与cookie都是由服务器生产的
- session存储在服务器端,而cookie存储在客户端或者浏览器端
- 客户端发送请求时会自动携带,本域名下,未过期的cookie
- 都具有生命周期
- 使用express-session进行开发(思路)
登陆页
/login 渲染登陆页面
/api/login 以post方式去访问,提交数据(用户名和密码)
通过验证,返回登陆成功,存储session(用户名和密码)
前台:失败:返回登陆页
成功:跳转到首页
首页:渲染首页(验证是否登陆成功)
/api/username get 返回当前是否登陆成功 (session取数据)
失败:提示信息
成功:提示信息,返回用户名
前台:失败:跳转到登陆页面
成功:提示用户信息,展示用户名
/api/logout 退出登录:摧毁session,返回信息。
前台:退出成功:跳转到登陆页面
项目应用
- 首先引入
express-session
- 在项目入口配置session
const session = require("express-session")
//配置session
app.use(session({
name: "CMS",
cookie: {
maxAge: 1000 * 60 * 30
},
secret: "keyboard cat",
resave: false, //以最后一次操作开始计时
saveUninitialized: true //刷新页面就会产生cookie
}))
- 在判断登陆成功后,创建session,并添加属性
userInfo
req.session.userInfo = req.body
输出session
Session {
cookie: {
path: '/',
_expires: 2022-07-08T09:23:10.970Z,
originalMaxAge: 1800000,
httpOnly: true
},
userInfo: [Object: null prototype] { username: 'xxxxx', password: 'xxxxxxx' }
}
- 在服务器渲染其他页面前,先进行判断,我们要定义一个中间件来做这个事情。
在一级路由中对二级路由进行配置,让浏览器渲染页面时都先判断是否有session,如果有就继续向下执行(去走二级路由),否则就重定向到登录页。同时因为该级路由下有登陆路由,为了防止在登录页时,不停重定向,出现
重定向次数过多的错误
,我们再进行判断,如果路径里包含login
,那么就终止执行(retrun后的代码不会执行)。
//在访问所有页面之前进行登陆验证
router.use((req, res, next) => {
if (req.url.includes("login")) {
next()
return
}
if (req.session.userInfo) {
next()
} else {
res.redirect("/admin/login")
}
})
- 将登陆信息传给管理端主页
渲染页面时,就把session中的值,传给页面,再用模板语法进行渲染(这里使用的是ejs模板引擎)
router.get("/", (req, res) => {
//渲染登陆页面
res.render("admin/index", { username: req.session.userInfo.username })
})
在页面需要登陆信息的地方使用<%=username%>
的方式进行渲染
- 退出登录后,需要销毁session
使用session自带的session.destroy()
,或者将session置空
router.get("/logout", (req, res) => {
req.session.destroy()
res.redirect("/admin/login/a")
})