即使标头在 Access-Control-Expose-Headers 中列出以响应服务器的响应，CORS 标头也不会在 react/axios 中公开答案

【问题标题】：CORS headers are not exposed in react/axios even if the headers are listed in Access-Control-Expose-Headers in response from server即使标头在 Access-Control-Expose-Headers 中列出以响应服务器的响应，CORS 标头也不会在 react/axios 中公开
【发布时间】：2020-12-03 00:35:28
【问题描述】：

我有一个使用 Axios 请求服务器的反应应用程序。我的服务器是一个 grails 应用程序。我想阅读我的客户端站点反应代码中的所有响应标头。为此，在我的 grails 应用程序中，我已设置公开我需要的所有标题，它们显示在浏览器中，并且也列在 Access-Control-Expose-Headers 中。但我仍然无法访问我的代码中的标题。在我的 axios 代码中，我使用 axios 拦截器来读取响应，例如：

api.interceptors.response.use(function (response) {
    console.log("response",response)
    let reqObject = response.request
    console.log("type", typeof reqObject)
    let resHeaders = reqObject.getResponseHeader('prabin');
    console.log("resHeaders",resHeaders)
    return response;
},function(error){
    return Promise.reject(error);
});

这在 chrome 的浏览器控制台中出现错误： 拒绝获取不安全的标头“prabin”

我不明白我错过了什么。

【问题讨论】：

标签： reactjs axios cors

【解决方案1】：

服务器需要允许访问您的来源。如果您在网络中看到标头，并不意味着您将在代码中看到所有这些标头。检查服务器上的内容

【讨论】：

【解决方案2】：

我发现我的实现出了什么问题。这些标题在 Access-Control-Expose-Headers：

text/html,application/xhtml+xml,application/xml;q=0.9,image/webp

它们似乎无效，因为客户端 javascript 代码无法读取所需的标头。删除这些标头后，我可以读取客户端代码中暴露的标头。

【讨论】：