我正在尝试使用我的 Vue.JS 和 ASP .NET Core 5 作为后端来实现刷新令牌。这是工作。我的意思是,我确实从 API 收到了 401 错误,我确实请求并获得了刷新令牌。我也从(以前)失败的请求中获取响应数据。但是,Vue 页面/组件保持空白/空。这是我的代码:
import axios from 'axios';
export default function setup() {
axios.interceptors.request.use(function (config) {
const token = localStorage.getItem('token');
config.headers.common["Authorization"] = `Bearer ${token}`;
return config;
}, function (err) {
return Promise.reject(err);
});
// Response interceptor for API calls
axios.interceptors.response.use((response) => {
return response
}, function (error) {
const originalRequest = error.config;
// Return any error which is not due to authentication back to the calling service
if (error.response.status !== 401) {
return Promise.reject(error);
}
if (error.response.status === 401 && !originalRequest._retry) {
originalRequest._retry = true;
axios.post(`api/auth/refresh-token`)
.then(response => {
const token = response.data.jwttoken;
const refresh_token = response.data.refreshtoken;
if (token) {
// Store jwt token in local storage
localStorage.setItem('token', token);
localStorage.setItem('refreshToken', refresh_token);
originalRequest.headers['Authorization'] = token;
error.config.headers['Authorization'] = `Bearer ${token}`;
return new Promise((resolve, reject) => {
axios.request(error.config).then(response => {
// Here I see the response data
console.log('JSON-interceptor-response-axios: ' + JSON.stringify(response));
resolve(response);
}).catch((error) => {
reject(error);
})
});
}
})
.catch(error => {
console.log('refresh-token error!' + error);
});
}
return Promise.reject(error);
});
}