为什么Chrome会取消CORS OPTION请求

时间:2013-02-27 15:21:43

标签: ajax google-chrome cors

在我的应用程序中,我正在创建从HTTP到HTTPS的AJAX请求。这意味着我需要CORS。所以我在jQuery.ajax中添加了一些头文件和参数并进行测试。在Firefox中,Everythings工作正常,但在Chrome中没有。 Chrome会“杀死”每个预先提出的请求(OPTIONS)。

jQuery脚本:

$(document).on('click', 'a.ajax', function(e) {
    e.preventDefault();
    $.ajax(this.href, {
        type: 'GET',
        dataType: 'json',
        crossDomain: false,
        headers: {'X-Requested-With': 'XMLHttpRequest'},
        xhrFields: {
            withCredentials: true
        }
    });
    return false;
});

HTTP转储:

> OPTIONS /foo HTTP/1.1
> User-Agent: curl/7.29.0
> Host: local.bar.cz
> Accept: */*
> Access-Control-Request-Headers:accept, origin, x-requested-with
> Access-Control-Request-Method:GET
> Origin:http://local.bar.cz
> 
< HTTP/1.1 204
< Server: nginx/1.2.7
< Date: Wed, 27 Feb 2013 15:06:54 GMT
< Content-Type: text/html; charset=utf-8
< Connection: keep-alive
< X-Powered-By: Nette Framework
< X-Frame-Options: SAMEORIGIN
< Access-Control-Allow-Origin: http://local.bar.cz
< Access-Control-Allow-Credentials: true
< Access-Control-Allow-Headers: accept, origin, x-requested-with
< Access-Control-Allow-Methods: OPTIONS, GET, POST, HEAD
< 

任何人都知道为什么chrome会杀死这个请求?

3 个答案:

答案 0 :(得分:17)

也许您的https服务器有不受信任的证书。如果是这样,请先尝试使用浏览器访问该URL,然后接受不受信任的连接。

答案 1 :(得分:12)

接受证书并不总能解决此问题。如果您使用自签名证书,即使您首先接受,Chrome仍会在某些情况下取消您的预检OPTIONS请求。自2011年以来就是这样:

该页面中指出的解决方法是将自签名证书添加到系统的可信证书列表中。

在Mac上执行此操作的说明(从原始版本略微修改,以便它适用于OS 10.8.5 http://www.robpeck.com/2010/10/google-chrome-mac-os-x-and-self-signed-ssl-certificates/):

  1. 在地址栏中,单击带有X的小锁。这将显示一个小信息屏幕。
  2. 点击“证书信息”按钮。
  3. 单击并将证书图像拖动到您的桌面一个打开的查找器窗口(它似乎不喜欢拖动到桌面。
  4. 双击创建的文件。这将打开Keychain Access实用程序。输入您的密码以解锁它。
  5. 请确保将证书添加到系统密钥链,而不是登录密钥链。点击“始终信任”,即使这似乎没有做任何事情。
  6. 添加完成后,双击它。您可能需要再次进行身份验证。
  7. 展开“信任”部分。 “使用此证书时,”设置为“始终信任”
  8. 您可能需要重新启动Chrome才能使证书完全受信任(图标将更改为网址栏中的快乐绿锁)。

答案 2 :(得分:7)

值得一提的是,另一个案例会产生绝对相同的结果:

如果您在等待返回请求(即通过承诺)时将浏览器重定位到不同的URL(window.location ..),则会提交OPTIONS请求,但后续响应(POST / GET / *)将被取消(自然..)

是..当然..如果你这样做,那就是一个错误..但它可能看起来一样,并且在错误的地方消耗数小时。 考虑这样的代码:

makeAjaxCallThatReturnsAPromise.then(
    function () { // doSomething },
    function () { // doSomethingElse }
);
location.replace('http://some.where/');