手把手教你实现一个vue3+ts+nodeJS后台管理系统（三）

开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第3天，点击查看活动详情

前言

在上文中我们完成了后端项目的数据库的创建和映射。接下来我们将编写用户路由（接口）。但首先要先有token模块（生成与解析）、图形验证码模块（返回前端及验证图形验证码）、输入信息校验。本文先完成token模块及校验信息模块。

登录路由实现的准备

校验输入参数

校验入参需要用到的依赖是joi，首先要安装依赖

安装所需依赖

// 验证与解析规则
npm install joi@17.6.0

验证规则模块

1. 在根目录创建schema文件夹

2. schema下创建user.js文件

3. 导入joi模块

   const joi=require('joi')
   

4. 编写字段对应的校验规则，例如

   // 用户名的校验规则，代表必须的最小1位最大10位包含a-zA-Z0-9的字符串
   const username = joi.string().alphanum().min(1).max(10).required();
   

5. 完成所需字段规则的编写

   schema/user.js

   let joi = require('joi');
   // 允许未设置规则的未知键
   joi = joi.defaults((schema) =>
     schema.options({
       allowUnknown: true
     })
   );
   /**
    * string() 值必须是字符串
    * alphanum() 值只能是包含 a-zA-Z0-9 的字符串
    * min(length) 最小长度
    * max(length) 最大长度
    * required() 值是必填项，不能为 undefined
    * pattern(正则表达式) 值必须符合正则表达式的规则
    */
   // 用户名的校验规则
   const username = joi.string().alphanum().min(1).max(10).required();
   // 密码的验证规则
   const password = joi
     .string()
     .pattern(/^[\S]{6,12}$/)
     .required();
   const checkCode = joi.string().alphanum().min(4).max(4).required();
   const uuid = joi.number().required();
   ​
   // 登录表单的验证规则对象
   exports.user_login_schema = joi.object().keys({
     username,
     password,
     checkCode,
     uuid
   });
   

6. 添加捕获验证错误的全局中间件

   app.js

    ...
    // 此段代码要放置在路由之后才可捕获到错误
    // 导入验证规则中间件
    const joi = require('joi');
    // 定义错误级别的中间件
    app.use((err, req, res, next) => {
      // 数据验证失败
      if (err instanceof joi.ValidationError) return res.send({ code: 1, message: err.message });
      // 未知错误
      return res.send({ code: 500, message: err });
    });
    // 启动服务器
    app.listen(...)
    ```
   

登录令牌的实现

安装所需依赖

// 用户权限验证，token的生成
npm install jsonwebtoken@8.5.1
// 解析token
npm install express-jwt@5.3.3

token生成及验证模块

1. 在根目录创建utils文件夹（用来存放一些工具方法）

2. utils下创建token.js文件

3. 在根目录创建config文件夹（存放一些配置信息）

   • 创建index.js文件存储配置信息

   配置信息主要是access_token、refresh_token的密钥及过期时间，如以下

   config/index.js

   module.exports={
      // token密钥
     jwtSecretKey: 'you are the best!',
     jwtRefrechSecretKey: 'be a better one!',
     secretKeyExpire: 60 * 60 * 2,   // 2小时
     refreshSerectKeyExpire: 60 * 60 * 24 * 2  //2天
   }
   

4. utils下token.js进行token的生成

   • 导入jsonwebtoken模块

     const jwt = require('jsonwebtoken');
     

   • 导入密钥

     const tkconf = require('../config/index');
     

   • 编写token工具函数并导出，包括生成token、解析token以及验证refreshToken

     /**
      * token生成函数
      * @param {*} user 存在token中的信息
      * @param {*} serect 密钥
      * @param {*} time  token存在时间
      * @returns
      */
     const addToken = function (user, serect, time) {
       //创建token并导出
     ​
       const token = jwt.sign(
         {
           id: user.id,
           username: user.username
         },
         serect,
         { expiresIn: time + 's' }
       );
       return token;
     };
     /**
      * token解析函数
      * @param {*} token
      * @returns
      */
     const decodedToken = function (token) {
       const decoded = jwt.decode(token);
       return decoded;
     };
     /**
      * 验证对应的refreshToken
      * @param {*} refreshToken
      * @returns
      */
     const verifyToken = function verify_refreshToken(refreshToken) {
       return jwt.verify(refreshToken, tkconf.jwtRefrechSecretKey, (err, decode) => {
         return err ? err : 1;
       });
     };
     ​
     module.exports = {
       addToken,
       decodedToken,
       verifyToken
     };