持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第28天，点击查看活动详情

后台项目 Express-Mysql-Vue3-Ts-Pinia 解析 token

引言

通过之前一段时间 Express 和 Mysql 的学习

这里尝试来搭建一个 后台系统 来巩固下学习的技术。

解析 token

在上一节，我们设置了 token 值，但是这还远远不够，还需要解析 token

首先在后端安装一个解析 token 的库

npm i express-jwt

我们继续在 useJwt.js 文件中来编写解析 token 的相关逻辑

设置白名单

首先我们需要在请求过来的时候，判断请求中是否存在 token

为什么这么说呢，因为有一些请求是肯定不存在 token 值的，例如

登录时的请求
注册时的请求

所以我们需要设置白名单列表，后续会有用

const allowList = ['/api/user/login', '/api/user/register']

token 位置

下一步就是，前端会将 token 放置到什么位置处呢？

这个位置的话，需要根据实际项目情况去确定下。

但是一般前端会将获取到的 token 值，放置在 请求头 中，以便于后续请求中一直携带。例如

config.headers.authorization = token

验证 token 是否过期

通过上面两个步骤，就可以进行 token 的验证

注意，这里有个参数 algorithms，是必填项，它的值有很多。

但是我们需要跟 设置 token 时的一样。即 HS256

为什么是这个值，因为源码中，如果 options 中没有传递，则默认是 HS256.

const { expressjwt } = require('express-jwt')


const jwtAuth = expressJwt({
  secret: config.PRIVATE_KEY, // 私钥
  
  algorithms: ['HS256'],

  credentialsRequired: true, // true 校验，false 不校验

  getToken: (req) => {
    if (req.headers?.authorization) {
      return req.headers.authorization
    }
  }
}).unless({
  // 设置 认证 的 白名单
  path: allowList
})

解析token

上面只是判断 token 是否过期，下面进行 token 的解析

用到的还是 jsonwebtoken 这个库，使用 verify 方法可以进行解析

const decode = (req) => {
  const token = req.headers?.authorization

  return jwt.verify(token, config.PRIVATE_KEY)
}

函数已经编写完成，我们需要将其挂载到所有的路由之前。

即在 router/index.js 的文件中进行引入即可

总结

通过 Express-Mysql-Vue3-TS-Pinia 做出一个后台系统项目，后端 token 的解析流程。

后台项目 Express-Mysql-Vue3-TS-Pinia 解析 token