IE CORS - Access-Control-Allow-Headers 错误，即使指定了 headers

Question

我目前在网页上向 API 端点提交 AJAX 请求，该端点在 Chrome 和 Firefox 中有效，但在 IE 中无效。

我在 IE 的开发工具中收到的错误消息是：

SEC7123: Request header x-custom-header was not present in the Access-Control-Allow-Headers list.
SCRIPT7002: XMLHttpRequest: Network Error 0x80070005, Access is denied.

查看 pre-flight OPTIONS 请求，这里有一些 headers:

Origin: http://www.example.org
Access-Control-Request-Headers: content-type, accept, x-custom-header
Access-Control-Request-Method: GET

pre-flight 的响应表明：

Access-Control-Allow-Headers: content-type, x-custom-header
Access-Control-Allow-Methods: GET, POST, PUT, OPTIONS
Access-Control-Allow-Origin: *

发生这种情况后，不会执行 AJAX 请求。看起来 IE 无法看到在 pre-flight 请求的响应中返回了 header。

任何帮助将不胜感激，如果您需要更多信息，请询问。

谢谢，詹姆斯

Answer 1

好的，我找到了解决方案。事实证明，IE 强制 header 的值位于逗号分隔列表中，并且 pre-flight 请求使用相同的键以多个 header 响应。（尽管 the W3 says that doing this should be okay）。例如，响应可以指定 Access-Control-Allow-Headers header 两次：

Access-Control-Allow-Headers: content-type
Access-Control-Allow-Headers: accept

网络选项卡上的所有开发工具（包括 IE）显示 headers 组合在一起作为逗号分隔列表，即使它们在技术上是不同的 headers 具有相同的名称.这就是混乱的来源。

这是在使用 Postman 模拟 pre-flight 请求并看到 header 作为单独的项目返回时发现的。

因此，要解决此问题，请确保 CORS headers（例如“access-control-allow-headers”包含逗号分隔列表而不是 headers，因为 IE 将只接受第一个发送的。例如，响应应该是：

Access-Control-Allow-Headers: content-type, accept

Answer 2

我们运行遇到 Internet Explorer 和 Access-Control-Allow-Methods 的 CORS 问题，它们与 OPTIONS 响应中的允许“*”不兼容。解决方法是更改 API 网关中的选项响应以使用所有方法

IE CORS - Access-Control-Allow-Headers 错误，即使指定了 headers

IE CORS - Access-Control-Allow-Headers error even though headers are specified

javascript

internet-explorer

access-control

cross-domain

cors