• axios reponse请求拦截以及token过期跳转问题


    前两天项目中遇到了token拦截,需要在请求的header头里放置token,需要用到response拦截,调试过程中遇到了拿不到token的问题

     我用的axios实例

     let token = store.state.token
    instance.interceptors.request.use(config => {
       
        // 在发送请求之前做些什么
        //判断是否存在token,如果存在将每个页面header都添加token
        config.headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
        // console.log('token===>',store.state.token);
        if(token!==''){
            config.headers.common['token'] = token;
        }
        return config;
    }, error => {
        // 对请求错误做些什么
        return Promise.reject(error);
    });

    总是拿不token

    后来根据请求步骤一步步检查发现

    取token应该放到reponse拦截内,放到拦截外因为初始化登录页的时候api已经被调用,这时候还没拿到token。所以token是空的

    正确的代码应该是

     instance.interceptors.request.use(config => {
        let token = store.state.token
        // 在发送请求之前做些什么
        //判断是否存在token,如果存在将每个页面header都添加token
        config.headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
        // console.log('token===>',store.state.token);
        if(token!==''){
            config.headers.common['token'] = token;
        }
        return config;
    }, error => {
        // 对请求错误做些什么
        return Promise.reject(error);
    });

    完美拿到了token,可是token过期登录时总是提示 'router' is not defined 或者是 ‘router’ is not token

    原因是由于单独调用的axios无法正常获取router

    我用了最简单的方法,绕过router

    // http response 拦截器
    let self = this
    instance.interceptors.response.use(
        response => { 
            if (response) {
                if (response.data.status == "401") {
                        store.commit('del_token');
                        window.location.href='#/login'
                        // window.routes.push({
                        //     path: '/login',
                            
                        //     // query: {redirect: router.currentRoute.fullPath}//登录成功后跳入浏览的当前页面
                        // })
                }
            }
            return response
        },

    完美解决!

  • 相关阅读:
    CF767C Garland
    P2458 [SDOI2006]保安站岗
    P2704 [NOI2001]炮兵阵地
    P2607 [ZJOI2008]骑士
    POJ 1201 Interval (查分约束系统)
    位运算的魅力---N皇后问题
    设计模式之代理模式20170724
    C之Volatile关键字的介绍与使用20170724
    设计模式之桥梁模式20170721
    设计模式之策略模式20170720
  • 原文地址:https://www.cnblogs.com/shoucigongkai/p/11763784.html
Copyright © 2020-2023  润新知