session

express-session插件

专门和express框架结合生成一个session空间

• 1.下载 npm i express-session
• 2.导入
• 3.挂载在服务上
  • express-session 会操作cookie，而且是自动操作cookie
  • app.use(session({对session空间的配置}))
    • secret：加密口令 哈希散列：不可逆
    • saveUninitialized：未初始化是否存储内容，默认为true
    • resave ：重新存储，一半为true,表示每一次session修改时都会重新存储
    • name:设置cookie的key
    • cookie:设置cookie的存储配置
• 4.使用
  • 会在req上添加一个成员叫session
  • 是一个对象空间，我们可以向里面添加一些成员信息
  • 当你第一次存储内容时，就已经把内容存进去了
    • expression-session插件会自动生成一个session id
    • 会自动把这个id分成两部分，一半放在cookie里，一半放在服务器的内存
• 问题：属于服务器的一半session id是存在内存里，
  • 一旦服务器重启，数据就消失了
  • 解决：持久化存储
    • 存储在数据库里面
    • express-session 有一个配置项叫做store
    • 需要依赖一个第三方插件connect-mongo

connect-mongo

1. 下载 npm i connect-mongo

2. 导入 ：require()

3. 配置

   • 使用connectMongo和session关联

   • 在配置session的时候配置使用

     • 在session的挂载配置里面
     • 添加一个store:newMongoStore({url:’’，存储位置})
     • 免密登录，验证登录信息
     • touchAfter()自动延伸过期事件（不推荐设置，最少建议设置一天），过期会自动删除

const express = require('express')
const router = require('./routes/router')
const cookieParser = require('cookie-parser')
// 2. 导入 express-session
const session = require('express-session')

// 导入 connect-mongo
// const connectMongo = require('connect-mongo')
// 和 session 关联
// const MongoStore = connectMongo(session)
const MongoStore = require('connect-mongo')(session)

const app = express()

// 3. 挂载 session
app.use(session({ // 进行各种配置
  secret: 'guoxiang',
  name: 'sessid',
  cookie: { maxAge: 1000 * 10 },
  resave: true,
  saveUninitialized: true,
  store: new MongoStore({
    // 你存储到 mongodb 的那一个位置
    url: 'mongodb://localhost:27017/gp19'
  })
}))

app.use(cookieParser())

app.use(router)

app.listen(8080, () => console.log('runnging at port 8080 ! ^_^'))

路由

const router = require('express').Router()
const fs = require('fs')
const template = require('art-template')

router
  .get('/index.html', (req, res) => {
    // 1. 自己读取指定目录下的指定
    fs.readFile('./views/index.html', 'utf8', (err, data) => {
      if (err) return console.log(err)

      // 访问 session 空间
      // 里面如果有这个信息, 表示登陆过, 我就给你正常显示页面
      // 如果没有我之前存储的信息, 表示没有登录, 或者 一半 session id 时假的
      // 直接跳转回登录页
      // 在这里的 req.session.nickname 如果是 undefined, 回到 login
      //  req.session.nickname === '郭翔' 表示登陆过
      // console.log(req.session)
      // 登录验证的判断
      // express 对于 res 添加了一个方法叫做 res.redirect()
      console.log(req.session)
      if (!req.session.nickname) return res.redirect('/login.html')

      // 2. 自己使用 art-template 去组装页面
      const html = template.render(data, { nickname: req.session.nickname })

      // 3. 自己手动把结果返回给前端
      res.send(html)
    })
  })
  .get('/login.html', (req, res) => {
    fs.readFile('./views/login.html', 'utf8', (err, data) => {
      if (err) return console.log(err)

      // 打开页面就默认登录成功了
      // 默认登录成功
      // 在 session 空间里面存储一个数据, 表示我登录成功了
      // 如果你需要存储, req.session.名字 = 值
      req.session.nickname = '郭翔'

      res.send(data)
    })
  })


module.exports = router

• 自己读取
• 自己使用art-template渲染页面组装页面
• 手动把结果返回给前端

express art-template插件

服务端渲染页面，专门和express结合的art-template模板引擎

1. 下载,两个都需要下载
   • npm i express art-template
   • npm i art-template
2. 配置（不需要导入）
   • 不是简单的挂载，而是配置在服务的引擎上
   • 语法：app.engine(后缀名，在引擎上配置哪个内容)
3. 使用
   • 当你在引擎上配置好以后
   • 会在res上添加一个方法叫render()
     • 语法：res.render(路径，对象)
       • 路径，默认是服务器根目录（app.js所在路径）下的views文件夹里面的路径a.html，会自动读取这个匹配的文件
       • 对象：成员，就是在指定文件里面使用的数据
       • 作用
         • 自动去view文件夹里面按照你的路径读取文件
         • 自动按照模板引擎组装好你的页面
         • 自动把这个拼接好的页面返回给前端
     • 问题：我的页面不一定非在views
       • 但是 express art-template自动读取views
     • 解决：修改默认目录
       • 我文件放在哪个目录里面就修改成那一个目录
       • app.set(要修改哪个内容, 修改成什么)
         • 如果你要写目录, 尽量时绝对路径

const express = require('express')
const router = require('./routes/router')
const cookieParser = require('cookie-parser')
const session = require('express-session')
const app = express()

// 1. 在服务引擎上配置 art-template
//    这里导入的 express-art-template 会自动导入 art-template
app.engine('html', require('express-art-template'))
// 设置 express-art-template 的默认读取目录
app.set('views', __dirname + '/pages')

app.use(session({
  secret: 'guoxiang',
  name: 'sessid',
  cookie: { maxAge: 1000 * 10 },
  resave: true,
  saveUninitialized: true
}))

app.use(cookieParser())

app.use(router)

app.listen(8080, () => console.log('runnging at port 8080 ! ^_^'))

路由

const router = require('express').Router()

router
  .get('/index.html', (req, res) => {
    // 根据 session 里面有没有指定成员来决定是不是渲染页面
    if (!req.session.nickname) return res.redirect('/login.html')

    // 1. 读取页面
    // 2. 组装页面
    // 3. 返回页面
    res.render('./a/index.html', { nickname: req.session.nickname })
  })
  .get('/login.html', (req, res) => {
    // 需要把登录页面给到前端
    // 1. fs
    // 2. send()
    req.session.nickname = '郭翔'
    res.render('./login.html', {})
  })


module.exports = router

• session id 加密的算法 哈希
• res.redirect() 后端重定向
• _dirname获得绝对路径

localStorage ES5页面

sessionStorage ES5 纯前端操作

cookie 可以来回携带 前后端都可以

session 后端（服务端）