Nuxt 框架 处理 前端 token

 实现思路:

一.获取用户token并持久化数据

//本地存储 
localStorage.setItem("token", baseResult.other.token)

二.配置axios插件(处理需要的token)

  2.1导入axios

2.2 请求携带token 与重定向

//导入element ui message
import { MessageBox } from 'element-ui'
export default function ({ $axios, redirect }) {
  $axios.onRequest((config) => {
    //获得token
    let token = localStorage.getItem("token");
    //携带token
    $axios.setToken(token);
  });

  $axios.onError((error) => {
    // 获得状态码
    const code = parseInt(error.response && error.response.status);
    console.log(code,"code");
    //重定向
    if (code === 400) {
      redirect("/400");
    }
    if(code === 401) {
      //删除无效token
      localStorage.removeItem('token')
      //提示
      MessageBox.confirm(error.response.data, '提示', {
        confirmButtonText: '重新登录',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        //确定,跳转到登录
        location.href = '/user/login'
      }).catch(() => {
        //取消
      });
    }
  });
}

  • 7
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值