javascript - 为什么浏览器不遵循使用 XMLHTTPRequest 和 CORS 的重定向?

标签 javascript ajax google-chrome rest cors

我正在使用 RESTful API 为某些服务编写 Web 应用程序。 API 位于 https://api.example,应用位于 https://app.example。使用 CORS 的简单 GET 请求在 Chrome 和 Firefox 中工作得很好。某些方法通过 POST 接受数据,并在 Location header 中返回带有新 uri 的 303 代码。

预检 OPTIONS 请求没问题:

Request Method:OPTIONS
Status Code:200 OK

请求 header

Accept:*/*
Accept-Charset:UTF-8,*;q=0.5
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8,ru;q=0.6
Access-Control-Request-Headers:origin, authorization, content-type
Access-Control-Request-Method:POST
Connection:keep-alive
DNT:1
Host:api.example
Origin:https://app.example
Referer:https://app.example/app/
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.32 (KHTML, like Gecko) Chrome/27.0.1425.0 Safari/537.32 SUSE/27.0.1425.0

响应头

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:Authorization, Content-Type
Access-Control-Allow-Methods:GET,POST,PUT,DELETE,HEAD,OPTIONS
Access-Control-Allow-Origin:https://app.example
Access-Control-Expose-Headers:*
Access-Control-Max-Age:3628800
Connection:keep-alive
Content-Length:0
Date:Sun, 05 May 2013 15:22:50 GMT
Server:nginx/1.2.5

然后实际请求在收到 303 后就停止了:

Request URL:https://api.example
Request Method:POST
Status Code:HTTP/1.1 303 See Other

响应头:

Server:nginx/1.2.5
Location:https://api.example/some_url
Date:Sun, 05 May 2013 15:27:49 GMT
Content-Type:application/json
Content-Length:0
Connection:keep-alive
Access-Control-Max-Age:3628800
Access-Control-Expose-Headers:*
Access-Control-Allow-Origin:https://app.example
Access-Control-Allow-Methods:GET,POST,PUT,DELETE,HEAD,OPTIONS
Access-Control-Allow-Headers:Authorization, Content-Type
Access-Control-Allow-Credentials:true

通过 RFC 用户代理应该遵循重定向,但 Chrome 和 FF 似乎没有按预期运行。是浏览器的错误还是我做错了什么?

更新:如果我使用 --disable-web-security 启动 chrome,一切正常。

最佳答案

我也一直在纠结这个问题。规范似乎禁止预检 CORS 请求的 3xx 重定向。

http://www.w3.org/TR/cors/

来自规范:

(第 1 步和第 2 步详细介绍了预检过程。我们来到这一步...)

...3. This is the actual request. Apply the make a request steps and observe the request rules below while making the request.

If the response has an HTTP status code of 301, 302, 303, 307, or 308 Apply the cache and network error steps.

然后如果我们向下滚动到 http://www.w3.org/TR/cors/#cache-and-network-error-steps :

Whenever the network error steps are applied, terminate the algorithm that invoked this set of steps and set the cross-origin request status to network error.

Note: This has no effect on setting of user credentials. I.e. if the block cookies flag is unset, cookies will be set by the response.

Whenever the cache and network error steps are applied, follow these steps:

Remove the entries in the preflight result cache where origin field value is a case-sensitive match for source origin and url field value is a case-sensitive match for request URL.

Apply the network error steps acting as if the algorithm that invoked the cache and network error steps invoked the network error steps instead.

(重点来自文档。)

但是,对于简单的 CORS 请求,允许 3xx 重定向。

关于javascript - 为什么浏览器不遵循使用 XMLHTTPRequest 和 CORS 的重定向?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16386148/

相关文章:

javascript - 具有动态加载内容的可折叠列表

javascript - IE 窗口失去对使用任何 XMLHttpRequest 启动 Angular 应用程序的关注

android - 使用 AccessibilityService Android 在 Chrome 中自动填充登录

python - 在 Python 中创建 headless Chrome 实例

javascript - Vue 中的使用/深度/bug

javascript - Html CSS Bootstrap 模态未显示

javascript - 如何在 javascript 中创建一个准确的计时器?

javascript - 分数总是添加到第一人称

google-chrome - 在不打开标签的情况下打开 chrome

javascript - 从一个页面调用 session 到另一个页面并将其包含在 javascript 中