手把手教你实现一个vue3+ts+nodeJS后台管理系统(六)

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

前言

我们继续上文来完成登录接口。我们已经完成了验证入参、验证码的验证。接下来还要完成

  1. 判断用户名是否存在、账号是否停用
  2. 对数据库中的密码解密进行密码验证
  3. 返回登录接口信息(token、refreshToken)

判断用户名是否存在,账号是否停用

router_handler/user.js

...
  // 查询数据库用户信息是否存在密码是否正确
  UsersModel.findOne({
    where: {
      username: username
    }
  }).then((result) => {
    if (!result) {
      /*
       * 返回体格式
       * code:0为成功、1为失败
       * message:接口信息描述
       * data:接口数据
       */
      return res.send({
        code: 1,
        message: '用户不存在',
        data: null
      });
    }else if (result.status === 0) {
      return res.send({
        code: 1,
        message: '帐号已停用',
        data: ''
      });
    }
...

密码验证

手把手教你实现一个vue3+ts+nodeJS后台管理系统(四)中我们用bcrypt库进行密码的加密,我们再通过这个库的compareSync进行解密比较,继续上面的代码

const compareResult = bcrypt.compareSync(password,result.password);
// 密码正确
if(compareResult){
   ...返回token等信息
}else{
  ...返回密码错误
}

返回token、refreshToken

手把手教你实现一个vue3+ts+nodeJS后台管理系统(三)我们完成了对token生成、解析、验证的封装。若没有看过的建议先看看。

我们先导入封装的token模块和对应token配置信息

// 引入封装好的token模块和配置信息
const { addToken, decodedToken, verifyToken } = require('../utils/token');
const key = require('../config/index');

然后通过此模块生成token、refreshToken返回

else {
      const compareResult = bcrypt.compareSync(password, result.password);
      if (compareResult) {
        // 用浏览器可识别的固定格式生成token
        const token =
          'Bearer ' + addToken({ id: result.id, username: result.username }, key.jwtSecretKey, key.secretKeyExpire);
        // 生成长时refreshToken
        const refreshToken = addToken(
          { id: result.id, result: result.username },
          key.jwtRefrechSecretKey,
          key.refreshSerectKeyExpire
        );
        return res.send({
          code: 0,
          message: '登录成功',
          data: {
            token,
            refreshToken
          }
        });
      } else {
        return res.send({
          code: 1,
          message: '密码错误',
          data: ''
        });
      }
    }

测试

1.输入不存在的用户名

image.png

2.登录成功

image.png

刷新token

登录接口已经完成了,但是当token过期的时候。前端会拿着refreshToken来刷新token(对token进行延时)。我们来完成一下这个操作。

添加路由

// 刷新token
router.post('/refreshToken', userHandler.refreshToken);

路由回调函数

我们先要对它输入的refreshToken进行验证,正确的话对它进行解码,然后再返回新的token和旧refreshToken,直至此refreshToken过期才是真正过期

/**
 * 刷新token
 */
exports.refreshToken = (req, res) => {
  const { refreshToken } = req.body;
  // 验证 refreshToken 1:通过
  let _res = verifyToken(refreshToken);
  if (_res === 1) {
    // 对refreshToken进行解码获得id、username
    let { id, username } = decodedToken(refreshToken);
    // 生成新的token
    const token = 'Bearer ' + addToken({ id, username }, key.jwtSecretKey, key.secretKeyExpire);
    res.send({
      code: 0,
      message: '获取成功',
      data: {
        token,
        refreshToken
      }
    });
  } else {
    res.send({
      code: 500,
      message: _res.message
    });
  }
};

测试

image.png

© 版权声明
THE END
喜欢就支持一下吧
点赞9 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容