拦截器里实现token值刷新

先引入要用到的模块

import axios from "axios";
import Cookie from "js-cookie";  //引入
import Base from "../utli/Base64"; //加密解密
import router from "@/router";		//路由跳转

新建axios实例

const instance = axios.create({
  baseURL: 'http://192.168.1.84:8081/m.api',//url
  timeout: 3000//请求超时
});

添加请求拦截器

instance.interceptors.request.use(config => {
  // 在发送请求之前做些什么
  // 给每个请求添加token
  config.headers['AdminToken'] = Cookie.get("token");
  return config;
}, error => {
  // 对请求错误做些什么
  return Promise.reject(error);
});

添加响应拦截器—无限刷新令牌,无痛刷新,令牌刷新

根据返回的状态码来做相对应的事情–10001 10006这个两个状态码需要做令牌刷新的功能
1.获取到登录的账户和密码
2.重新登录
3.把重新登录之后的token重新赋值给请求头(aysnc—await)

instance.interceptors.response.use(response => {
  // 对响应数据做点什么
  if (response.data.errno == 10001 || response.data.errno == 10006) {
  //在这里做判断是否有记住密码,有就token值刷新,否者就跳回登录页面
    if (Cookie.get("name") && Cookie.get("pass")) {
      return testResult(response)
    } else {
      router.push("/");
    }
  } else {
    return response;
  }
  return response;
}, error => {
  // 对响应错误做点什么
  return Promise.reject(error);
});

在这里做请求

async function testResult(response) {
  let res = await instance({
    methods: 'get',
    params: {
      _gp: "admin",
      _mt: "login",
      username: Base.decode(Cookie.get("name")),
      password: Base.decode(Cookie.get("pass")),
      verifyCode: '666666',
    }
  })
  if (res.data.errmsg == "成功") {
    let expireDate = new Date(new Date().getTime() + 20 * 60 * 1000)
    Cookie.set('token', res.data.data, { expires: expireDate })
    response.config.headers["AdminToken"] = res.data.data;
    return await axios(response.config); //返回改变后的配置
  }
} 

最后再暴露出去

export default instance
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值