如何修复导致属性'status'未定义错误的 Axios 拦截器

Question

我可以选择将元素的权限设置为全局或私有。我正在使用Axios拦截器请求来处理查找权限字段以获取数据的问题，如果是，则将其字符串化；TypeError:无法读取未定义的"的属性"status"；当我试图重新加载程序时。唯一的"；"修复"；现在是注销，删除拦截器，登录，读取它，然后再次运行检查。

正因为如此，我甚至无法访问软件的主页面板。如果我清除了我的cookie，我可以返回登录屏幕，但在尝试登录后不会再继续。

我有什么遗漏吗？下面是拦截器代码。如果需要更多信息或背景，请告诉我。

export default {
install: (Vue) => {
Vue.$eventBus = new Vue();
Vue.axios.interceptors.response.use(response => {
return response.data;
}, async error => {
if (error.response.status === 401 && error.config.url != '/api/authentication/login') {
var config = await Vue.$configService.find();
window.location = config.accountPortalUrl;
return
}      
console.log(error);
Vue.$eventBus.$emit('notifyUser', 'Uh oh, something went wrong!');
return Promise.reject(error);
});
Vue.axios.interceptors.request.use(
config => {
// check request method -> use post if many params
if (config.data.permissions) {
config.data.permissions = JSON.stringify(config.data.permissions);
}
console.log(config);
return config;

}
);
}
};

Answer 1

看起来您的服务API没有响应，如果用户未通过身份验证，则可能会发生这种情况。您的错误在您检查的行(error.response.status(。只有当请求在响应之前中断时，才可能得到未定义的响应。最有可能的是，如果你检查你的浏览器网络面板，你会发现这个请求的飞行前检查会导致401网络错误。因此，由于飞行前失败，你的实际反应是不确定的。您应该首先检查服务器是否响应，然后访问响应状态。

像这样的东西可能有助于

if (error.response) {
// Request was made and the server responded successfully
// You can now de-structure the response object to get the status
console.log(error.response.status);
} else if (error.request) {
//  request was made but not responded by server
console.log(error.request);
} 

Answer 2

因此，最终的答案非常简单。

if (config.data.permissions)

需要

if (config.data && config.data.permissions)