登陆验证-基于express开发

sessio 与 cookie:

基于HTTP协议，HTTP是一种无状态的协议

1. 为什么有session与cookie
   web 1.0：资源共享，
   web 2.0: 交互，多部操作，依赖数据
   session与cookie：来实现状态的记录，解决Http无状态的缺陷。

2. session和cookie的区别和特点：

• session与cookie都是由服务器生产的
• session存储在服务器端，而cookie存储在客户端或者浏览器端
• 客户端发送请求时会自动携带,本域名下,未过期的cookie
• 都具有生命周期

4. 使用express-session进行开发（思路）

登陆页
/login 渲染登陆页面
/api/login 以post方式去访问，提交数据(用户名和密码)
通过验证，返回登陆成功，存储session(用户名和密码)

前台：失败：返回登陆页
成功：跳转到首页

首页：渲染首页(验证是否登陆成功)
/api/username get 返回当前是否登陆成功 (session取数据)
失败：提示信息
成功：提示信息，返回用户名
前台：失败：跳转到登陆页面
成功：提示用户信息，展示用户名
/api/logout 退出登录：摧毁session,返回信息。
前台：退出成功：跳转到登陆页面

项目应用

1. 首先引入express-session
2. 在项目入口配置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
}))

3. 在判断登陆成功后，创建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' }
}

4. 在服务器渲染其他页面前，先进行判断，我们要定义一个中间件来做这个事情。

在一级路由中对二级路由进行配置，让浏览器渲染页面时都先判断是否有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")
  }
})

5. 将登陆信息传给管理端主页
   渲染页面时，就把session中的值，传给页面，再用模板语法进行渲染(这里使用的是ejs模板引擎)

router.get("/", (req, res) => {
  //渲染登陆页面
  res.render("admin/index", { username: req.session.userInfo.username })
})

在页面需要登陆信息的地方使用<%=username%>的方式进行渲染

6. 退出登录后，需要销毁session
   使用session自带的session.destroy(),或者将session置空

router.get("/logout", (req, res) => {
  req.session.destroy()
  res.redirect("/admin/login/a")
})