token过期,用refreshToken 去刷新 token
处理: 在每一个请求之前,都去请求刷新token的接口,这里在axios里面用的ajax,因为在axios里面用到了响应拦截,如果还用axios,就会陷入死循环。因为涉及到一个页面刚进入,会去请求多个接口,造成 一个页面刚进入会请求多个token接口,所以 用到
防抖、节流,这些都是在axios的请求拦截器里面进行处理的。
let dounceNum = 1;
axios.interceptors.request.use(function (config) {
let token = Cookies.get('token');
let userid = Cookies.get('userid');
// let refreshToken = Cookies.get('refreshToken');
// let userName = Cookies.get('userName');
if (dounceNum == 1) {
$.ajax({
type: 'post',
url: config.baseURL + '/isc/auth/token',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'X-Authorization': 'Bearer ' + Cookies.get('refreshToken')
// 'ticket': store.getters.User.ticket || '',
// 'locale': i18n.locale || ''
},
contentType: "json",
dataType: "json",
data: JSON.stringify({ 'userid': Cookies.get('userid') }),
cache: false,
async: false,
success: function (res) {
// console.log(res)
if (res.code == '00000000') {
Cookies.set('token', res.data.token);
Cookies.set('refreshToken', res.data.refreshToken);
let token = Cookies.get('token');
// console.log('token1', token)
config.headers['X-Authorization'] = `Bearer ${token}`;
} else {
// Message.error('登陆信息已失效,请重新登陆')
}
}
});
} else {
}
setTimeout(() => {
dounceNum = 1
}, 1000)
dounceNum = dounceNum + 1;
if (token && userid) {
// console.log('99999')
if (config.url === 'isc/auth/token') {
let refreshToken = Cookies.get('refreshToken');
config.headers['X-Authorization'] = `Bearer ${refreshToken}`;
config.headers.common['X-Authorization'] = `Bearer ${refreshToken}`;
} else {
let token = Cookies.get('token');
// console.log('token2', token)
config.headers['X-Authorization'] = `Bearer ${token}`;
config.headers.common['X-Authorization'] = `Bearer ${token}`;
}
} else {
if (token === null || userid === null) {
router.replace({
path: '/login'
})
}
}
// console.log(config.headers)
return config
}, function (error) {
return Promise.reject(error)
});
中途需要注意点:1、 ajax 只能是同步请求, 异步的话, 就算拿到新的token,也因为响应问题,不会去替换请求头
2、替换请求头的时候,使用 config.headers['X-Authorization'] = `Bearer ${token}`;有效!
之前的写法是:config.headers.common['X-Authorization'] = `Bearer ${token}`; 无效!