Question

我们目前正在构建一个支持RESTful API的Angular应用程序。该应用尝试使用以下请求网址获取用户的信息：http://example.com:1337/api/users/1。该资源用HTTP 301（永久移动）进行响应，并设置资源移动到的位置标题，例如， Location=http://another-hostname.com:8088/new/users/1。 Angular的HTTP客户端或者更确切地说浏览器会自动处理此响应并重定向到这个新位置。

可悲的是，在Chrome中我们收到以下错误消息：

XMLHttpRequest cannot load http://example.com:1337/api/users/1. Redirect from 'http://example.com:1337/api/users/1' to 'http://another-hostname.com:8088/new/users/1' has been blocked by CORS policy: Request requires preflight, which is disallowed to follow cross-origin redirect.

Chrome在调用GET到新资源之前会跳过预检请求（CORS）。我们用Firefox对它进行了测试，并且它运行良好。 Firefox发出新的预检请求，之后的GET请求将成功处理。

所以，我想知道这里的正确行为是什么。有没有人用30倍的回复做出类似的经历？

是否有可能禁用自动浏览器（或Angular HTTP客户端）重定向处理？这样我们就可以使用全新的this.http.get(...)手动处理新的GET。

感谢您的任何建议，

迈克尔

Answer 1

Chrome在调用GET到新资源之前会跳过预检请求（CORS）。我们用Firefox对它进行了测试，并且它运行良好。 Firefox发出新的预检请求，之后的GET请求将成功处理。

您可以在此处找到有关其他解决方法的讨论以及指向COR3 W3C建议书相应部分的链接：https://stackoverflow.com/a/39728229/4282127。

自版本57以来，Chrome应该支持重定向（3xx）的预检请求。因此，更新到最新的Chrome版本应该至少解决缺少预检请求的问题。

Answer 2

是否有可能禁用自动浏览器（或Angular HTTP客户端）重定向处理？

无法使用XMLHttpRequest（以及Angular的$ http）。这个选项在fetch()中提供，但它还不是交叉浏览器。

但是一种解决方法：

通过特殊预备确定最终请求目的地请求（通过检查XHR.responseURL） 这应该是一个简单请求：只有GET / POST / HEAD而且只有simple headers - 所以它不会产生预检。
< / LI>
向该目的地提出“真实”请求。

这里的正确行为是什么

最初禁止跨站点重定向，但现在允许（since 4 Aug 2016） - 但大多数浏览器尚未实施此更改。

在MDN https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Preflighted_requests_and_redirects

由于Chrome中缺少预检请求而导致阻止的HTTP重定向

2 个答案: