vue.js - Axios 捕获错误只显示网络错误而不是来自服务器的消息

Question

我是 JavaScript 新手，正在尝试使用 Vuejs 构建一个 SPA 项目，并使用 .NET WebAPI 作为后端。

当我使用 Axios 向 WebAPI 发送请求时，如果服务器端出现错误，在 catch 中，我只会得到 'Error: NetWork Error'，但在 Fiddler 中，我可以看到从服务器返回的真实消息：例如: 406 '版本不允许 blablab'。

axios.get("My_WebAPI_IURL")  
    .then(response => {
        console.log(response);
    })
    .catch(error => {
        console.log(error);
        return Promise.reject(error)
    })

同样在控制台中，有一条 CORS 的错误消息

从源“ http://localhost:8080 ”访问“ http://blablabla ”处的 XMLHttpRequest已被 CORS 策略阻止：请求的资源上不存在“Access-Control-Allow-Origin”标头。

错误： 在 XMLHttpRequest.handleError (xhr.js:87)
的 createError (createError.js:16)处出现网络错误

但是我已经在 WebAPI 上配置了允许 CORS，通常所有端点都正常工作，当服务器返回错误响应时，我只有这个 CORS 错误消息。

我在网上搜索，并尝试了error.reponse，但它总是未定义。

问题出在哪里？

这是 WebAPI 中启用 CORS 的代码

var cors = new EnableCorsAttribute("*", "*", "*");
config.EnableCors();

标签： vue.jsaxios