前端怎么在响应头和请求头里面拿数据？

Posted 2022-07-17 taoyuanju

今天碰到一个比较困难的问题，对于前端小白来说一脸懵逼。问题就是怎么在响应头里面获取token，对于token想必大家都不陌生，但是到响应头里面获取token还是头一次。之前token都是后端返回给前端，听到这个需求之后，心中万马奔腾。接下来就是vue中的axios怎么从响应头里面拿token:

---

   axios.interceptors.response.use( response =>   //axios拦截器
    if (response.status === 200)   //响应成功后
        if(response.headers['Authorization'])  //获取响应头里面的数据，**Authorization根据你响应头里面的数据获取，并不是唯一值**
            downLoad(response.data,response.headers['Authorization'].split(';')[1].split('=')[1]);
        
        return Promise.resolve(response);
     else 
        return Promise.reject(response);
    
    , error =>   //报错后的处理，这里不是重点，
    // 服务器状态码不是200的情况
    if (error.response.status) 
        switch (error.response.status) 
            case 401:
            Notification.error(
                title: '错误',
                message: '登录过期，请重新登录'
            );
        // 清除token
        localStorage.removeItem('token');
        store.commit('loginSuccess', null);
        setTimeout(() => 
            router.replace(
                path: '/login',
                query: 
                    redirect: router.currentRoute.fullPath
                
            );
        , 1000);
    break;
    case 404:
        Notification.error(
            title: '错误',
            message: '网络请求不存在',
        );
    break;
    case 504:
        Notification.error(
            title: '错误',
            message: '服务器内部异常',
        );
    break;
    // 其他错误，直接抛出错误
    default:
        Notification.error(
            title: '错误',
            message: error.response.data.message
        );

    return Promise.reject(error.response);

    
);

详情见axios链接 https://www.kancloud.cn/yunye/axios/234845

每天改一个bug，成长一大步