Chrome 说没有“Access-Control-Allow-Origin”标头，但标头在那里

Posted 2023-02-27

【中文标题】Chrome 说没有“Access-Control-Allow-Origin”标头，但标头在那里

【英文标题】：Chrome saying No 'Access-Control-Allow-Origin' header, but the header is there

【发布时间】：2014-11-26 16:35:48

【问题描述】：

这个问题已经在 *** 中提到过十几次了，但是我有一个不同的问题。

Chrome 首先调用“OPTIONS”来获取标题。如您所见，正确的标题在那里。

由于某种原因，Chrome 不会注意到标头，并以与根本不存在标头时相同的方式取消实际请求。

该页面实际上进行了三个调用，奇怪的是，其中一个有效。

所以问题是，当标题确实存在时，为什么 Chrome 不尊重它？我可以做些什么来调试它？

更新

我尝试添加Access-Control-Allow-Methods，所以现在来自 OPTIONS 调用的标头响应包括这些响应标头：

Access-Control-Allow-Headers:Origin, X-Requested-With, Content-Type, Accept
Access-Control-Allow-Methods:POST, GET, OPTIONS
Access-Control-Allow-Origin:*

结果是一样的。

在服务器端设置标头

我在每个请求的服务器端设置标头（在 Global.asax.cs Application_BeginRequest 中）

Response.Headers.Add("Access-Control-Allow-Origin", "*");
Response.Headers.Add("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
Response.Headers.Add("Access-Control-Allow-Methods", "POST, GET, OPTIONS");

与 Fiddler 调查后

我查看了原始请求和响应，发现了一些令人惊讶的信息：错误是来自应用程序的简单 HTTP 500 错误。可能是因为 HTTP 500 错误不包含正确的标头，Chrome 不会显示返回的错误，而是显示与标头相关的错误。

回答

因此，总而言之，如果 Chrome 给出 No 'Access-Control-Allow-Origin' header 它实际上可能会掩盖 HTTP 500 错误。这可以通过检查 Fiddler 中的请求和响应来确定。

【问题讨论】：

还有代码……代码在哪里？？

还应该有一个Access-Control-Allow-Methods 标头。我在屏幕截图中没有看到它。

@RobertRozas 谢谢。这个问题是关于 Chrome 为何如此行事的原因，所以我尽量不包含会使注意力从我试图理解的问题上移开的代码。但如果需要，我可以发布原始请求/响应？

@NielsBrinch 你能确定正确的 OPTIONS 响应与无效响应有何不同吗？

在这种情况下，客户端代码完全无关紧要。但是，有些人可能有兴趣查看您在何处/如何设置 cors 标头。

【参考方案1】：

如果 Chrome 显示No 'Access-Control-Allow-Origin' header，它实际上可能会掩盖 HTTP 500 错误。这可以通过检查 Fiddler 中的请求和响应来确定。

【讨论】：

这个。是否在某处指定浏览器可以在 500 上执行任何操作？

OPTIONS 调用应该告诉浏览器可以继续进行真正的调用。如果 OPTIONS 调用失败，它最终不会向浏览器授予此权限，这实际上是浏览器向您报告的内容。

我认为 Chrome 在很多情况下都会错误地给出这个错误信息，例如我有错误的 URL（正确的服务器、错误的路径、AJAX），并且选项调用包含所有标头，但实际调用失败并显示该错误消息。很难调试。

是的，很难调试。不确定我们可以责怪 Chrome，因为我猜它确实做了它应该做的事情。但是，如果它可以分享有关失败 OPTIONS 的更多详细信息，那就太好了。不确定他们是否已经在此期间实际改进了这一点。