egg使用jwt验证

原理：vue前端登录，提交账号密码给egg后端，后端比对信息后，使用jsonwebtoken对用户信息进行签名生成token，之后通过cookie返回给vue前端，前端需要使用token里的信息就使用js-base64进行token第二段解码即可。



vue前端路由跳转，进入路由前置守卫检测cookie中的token是否存在，不存在(已过期)则跳转登录，否则继续执行，然后在http拦截器里请求时存在token请求头带上token，后端未得到header则返回错误码，得到则用jsonwebtoken进行验证，是时间错误就从新发放token令牌，否则返回错误码，还要及时更新cookie时间，保证登录态.



vue前端main.js中：



import axios from 'axios';

import cookie from './public/util';

router.beforeEach((to, from, next) => {

  console.log('路由拦截')

  //判断要去的路由有没有requiresAuth

  if (to.meta.requiresAuth) {

    let token = cookie.getCookie('token');

    if (token) {

      next();

    } else {

      next({

        path: '/login'

      });

    }

  } else {

    next(); //如果无需token,那么随它去吧

  }

})

// http request 拦截器

axios.interceptors.request.use(

  config => {

    let token = cookie.getCookie('token');

    console.log(token)

    if (token) {  // 判断是否存在token，如果存在的话，则每个http header都加上token

      config.headers.authorization = token ${token};

    }

    return config;

  },

  err => {

    return Promise.reject(err);

  });

 

// http response 拦截器

axios.interceptors.response.use(

  response => {

    return response;

  },

  error => {

    if (error.response) {

      switch (error.response.status) {

        case 401:

          // 返回 401 清除token信息并跳转到登录页面

          router.replace({

            path: '/login'

          });

      }

    }

    return Promise.reject(error.response.data);   // 返回接口返回的错误信息

  });

Vue.prototype.$http = axios;

其中util.js中我封装了操作cookie的方法



//获取cookie、

function getCookie(name) {

    var arr, reg = new RegExp("(^| )" + name + "=([^;])(;|$)");

    if (arr = document.cookie.match(reg))

     return (arr[2]);

    else

     return null;

   }

    

   //设置cookie,增加到vue实例方便全局调用

function setCookie (c_name, value, expiredays) {

    var exdate = new Date();

    exdate.setDate(exdate.getDate() + expiredays);

    document.cookie = c_name + "=" + escape(value) + ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString());

   };

    

   //删除cookie

function delCookie (name) {

    var exp = new Date();

    exp.setTime(exp.getTime() - 1);

    var cval = getCookie(name);

    if (cval != null)

     document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString();

   };

   module.exports = {

    getCookie:getCookie,

    setCookie:setCookie,

    delCookie:delCookie

   }

路由中需要登录才能访问的页面，应：



path:'/admin/manager',component:Page,name:'管理系统首页',meta:{requiresAuth:true}

如果需要获取token中的信息则：



let token = cookie.getCookie('token');

let Base64 = require('js-base64').Base64;

let str = token.split('.')[1];

let user = JSON.parse(Base64.decode(str));

console.log(user)

后端在登录逻辑执行完后，需要给前端发放token



 let jwt = require('jsonwebtoken');

        let token = jwt.sign({

            user_id:1,

            user_name: '张三'

          }, '自定义签名盐值', {

            expiresIn: '60s' //时间根据自己定，具体可参考jsonwebtoken插件官方说明

          });

this.ctx.cookies.set('token', token, {maxAge:601000,httpOnly:false,overwrite:true,signed:false})

this.ctx.body = true;

接着是中间件：

    module.exports = () => {

  const jwt = require('jsonwebtoken');
  return async function (ctx, next) {
    if (ctx.request.header['authorization']) {
      let token = ctx.request.header['authorization'].split(' ')[1];
      console.log(token)
      let decoded;
      //解码token
      try {
        decoded = jwt.verify(token, '加签时定义的盐值');
      } catch (error) {
        if (error.name == 'TokenExpiredError') {
          console.log('时间到期')
          //重新发放令牌
          token = jwt.sign({
            user_id: 1,
            user_name: '张三'
          }, 'sinner77', {
            expiresIn: '60s' //过期时间设置为60妙。那么decode这个token的时候得到的过期时间为 : 创建token的时间 +　设置的值
          });
          ctx.cookies.set('token', token, {
            maxAge: 60 * 1000,
            httpOnly: false,
            overwrite: true,
            signed: false
          });
        } else {
          ctx.status = 401;
          ctx.body = {
            message: 'token失效'
          }
          return;
        }
      }
      //重置cookie时间
      ctx.cookies.set('token', token, {
        maxAge: 60 * 1000,
        httpOnly: false,
        overwrite: true,
        signed: false
      });
      await next();
    } else {
      ctx.status = 401;
      ctx.body = {
        message: '没有token'
      }
      return;
    }
  }
};

最后在需要登录才可访问的资源路由上使用该中间件，如:

 const checktoken = app.middleware.checktoken();
 router.get('/test',checktoken,controller.util.test);
至此，以cookie维护登录态，token做登录权限验证就完成了
————————————————
版权声明：本文为CSDN博主「JiangYuXuan1994」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/JiangYuXuan1994/article/details/80196090