这似乎不起作用:
$.ajax({ url: "http://localhost:3000/foo.json", data: { foo: 'bar' }, headers: { 'HTTP_X_CUSTOMHEADER': 'foobar' }, xhrFields: { withCredentials: true } });
当我在jsfiddle上运行它时,将触发一个OPTIONS请求(根据Chrome调试工具),如下所示:
OPTIONS
Access-Control-Request-Headers: Origin, HTTP_X_CUSTOMHEADER, Accept Access-Control-Request-Method: GET Origin: http://fiddle.jshell.net
然后(根据Chrome调试工具)我的本地服务器返回以下标头:
(手动重新格式化以提高可读性)
Access-Control-Allow-Credentials: true Access-Control-Allow-Headers: HTTP_X_CUSTOMHEADER Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS Access-Control-Allow-Origin: http://fiddle.jshell.net Access-Control-Max-Age: 10 Cache-Control: no-cache Connection: Keep-Alive Content-Length: 1 Content-Type: text/html; charset=utf-8 Date: Wed, 14 Sep 2011 22:42:28 GMT Server: WEBrick/1.3.1 (Ruby/1.8.7/2010-01-10) X-Runtime: 2
然后在控制台中,我收到如下错误消息:
XMLHttpRequest cannot load http://localhost:3000/foo.json?foo=bar. Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin.
但是Access-Control-Allow-Origin标题与我的服务器响应预检请求时显示的标题相同。那么,我在这个难题中遗漏了什么?
Access-Control-Allow-Origin
OHHHHH,好的,我终于明白了…
显然,飞行前OPTIONS响应标头是唯一需要它们的地方。您还需要在响应中包括这些标头以获取实际内容。我只有这些标头出现在飞行前,以为那是唯一需要的“票”。
因此,我向实际资产的GET请求中添加了相同的标头,并且现在一切正常。我想我在文档中错过了。