目录

---------

最终项目代码的仓库:Plumbiu/authorization

这里只讲解一些基本的用法

Cookie

Javascript
const express = require('express')
const app = express()

app.get('/set-cookie', (req, res) => {
  res.cookie('name', 'test') // 会在浏览器关闭的时候销毁
  res.send('home')
})

app.listen(3000, () => {
  console.log('server is running at http://127.0.0.1:3000')
})

通过 res.cookie 即可设置 cookie,我们打开浏览器查看 cookie:

  1. 第一次访问 127.0.0.1:3000/set-cookie

根据 cookie 的流程,第一次请求服务器时,请求头中是不包含 cookie 属性的,而响应头包含 Set-Cookie 属性

  1. 第二次访问 127.0.0.1:3000/set-cookie

可见请求头中已经包含了 cookie 属性

  1. 访问 127.0.0.1:3000

之前我们访问的是 127.0.0.1:3000/set-cookie,现在我们访问根路径,看是否含有 cookie

可见请求头中还是包含 cookie 的,但是响应头不包含 set-cookie 属性,这很好理解,因为代码中已经写明,只有访问 /set-cookie 时才会设置响应头的 set-cookie 属性

  1. 关闭浏览器重新访问 127.0.0.1:3000

可见 cookie 消失了,这与 cookie 的有效时间有关

在上述代码中更改,在 res.cookie 第三个参数加上 maxAge 配置项,单位为 ms

Javascript
res.cookie('name', 'test2', { maxAge: 60 * 1000 })
  1. 第一次访问 127.0.0.1:3000/set-cookie

响应头成功携带了 Set-Cookie 属性,同时注意到,比之前的 cookie 多出了几个值:

  1. 第二次访问 127.0.0.1:3000/set-cookie

第二次访问与第一次访问时间要小于 60s,才会看到请求头中的 cookie 属性

  1. 第一次访问 127.0.0.1:3000

  1. 60s 后 127.0.0.1:3000

响应头和请求头有关 cookie 的属性均消失,这与最开始配置的 { maxAge: 60 * 1000 } 有关

使用 res.clearCookie(key) 删除属性名为 key 的 cookie

Javascript
app.get('/set-cookie', (req, res) => {
  	res.cookie('name', 'test2', { maxAge: 60 * 1000 }) // maxAge 最大有效时间
  	res.cookie('theme', 'blue')
  	res.send('home')
})

// 删除 cookie
app.get('/remove-cookie', (req, res) => {
  	// 调用方法
  	res.clearCookie('name')
  	res.send('删除成功')
})

连续访问两次 /set-cookie

连续访问两次 /remove-cookie

首先安装 cookie-parser:

Bash
yarn add cookie-parser

代码:

Javascript
const cookieParser = require('cookie-parser')
app.use(cookieParser())
app.get('/get-cookie', (req, res) => {
  	// 获取 cookie
  	res.send(req.cookies)
})

访问 /get-cookie

Session

express 实现 session

安装 express-sessionconnect-mongo 中间件:

Bash
yan add express-session connect-mongo mongodb

代码:

session() 的参数中配置中间件

Javascript
const session = require('express-session')
const MongoStore = require('connect-mongo')

app.use(session({
  	name: 'sid', // 设置 cookie 的 anme,默认值是:connect.sid
  	secret: 'plumbiu', // 参与加密的字符串(又称签名)
  	saveUninitialized: false, // 是否每次请求都设置一个 cookie 来存储 session 的 id
  	resave: true, // 是否在每次请求时重新保存 session
  	store: MongoStore.create({
    	mongoUrl: 'mongodb://127.0.0.1:27017/control', // 数据库的连接配置
  	}),
  	cookie: {
    	httpOnly: true, // 开启后前端无法通过 JS 操作 cookie
    	maxAge: 1000 * 3000 // 控制 sessionId 的过期时间,不是 cookie 的!!!
  	}
}))

express 操作 session

  1. session 的设置
Javascript
app.get('/login', (req, res) => {
    // 规定 admin、password 均为 admin 才能登陆
    const { username, password } = req.query
    if(username === 'admin' && password === 'admin') {
        // 设置 session 的信息
        req.session.username = 'admin'
        req.session.uid = 'xxxx'
        res.send('登录成功')
    } else {
        res.send('登陆失败')
    }
})

此时我们访问 /login?username=admin&password=admin 即可登录成功。查看数据库,数据会自动创建

  1. session 的读取
Javascript
app.get('/cart', (req, res) => {
    // 检测 session 是否存在用户属性
    const { username } = req.session
    if(username) {
        res.send(`欢迎您${username}`)
    } else {
        res.send('对不起,您还未登录')
    }
})
  1. session 的销毁
Javascript
app.get('/logout', (req, res) => {
    req.session.destory(() => {
        res.send('退出成功')
    })
})

访问 /logout 之后,数据库中的信息便会自动销毁

Token

JWT(JSON Web Token)是目前最流行的跨域认证解决方案,可用于基于 token 的身份认证

安装 jsonwebtoken

Javascript
yarn add jsonwebtoken

生成一个 token

使用 jwt.sign 方法

Javascript
let token = jwt.sign({
    username: 'plumbiu'
}, 'secret', {
    expiresIn: 60 * 60
})

jwt.sign 方法接收三个参数,分别为:

验证 token

使用 jwt.verify 方法

Javascript
jwt.verify(token, 'secret', (err, data) => {})

jwt.verify 方法接收三个参数,分别为:

data 对象: