今日はフロントエンドのための困難な問題が発生したが、白が強制されて無知に見えます。問題は、おそらく誰もが精通しているトークンのために内部の頭に応じてトークンを取得しますが、トークン応答は初めてだった頭の中に取得する方法です。後にトークン全速力、心をこの要求を聞くためにフロントエンドにバックエンドで返される前に。次のステップは、トークン内の応答ヘッダにaxiosのVUEから取得する方法です。
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
一日のバグを変更し、大きな成長