jQuery $.ajax()， $。post发送“OPTIONS”作为Firefox中的REQUEST_METHOD

有什么问题，我认为是一个相对简单的jQuery插件…

插件应该通过ajax从php脚本中获取数据，并将选项添加到<select>。ajax请求非常通用:

$.ajax({
  url: o.url,
  type: 'post',
  contentType: "application/x-www-form-urlencoded",
  data: '{"method":"getStates", "program":"EXPLORE"}',
  success: function (data, status) {
    console.log("Success!!");
    console.log(data);
    console.log(status);
  },
  error: function (xhr, desc, err) {
    console.log(xhr);
    console.log("Desc: " + desc + "\nErr:" + err);
  }
});

这在Safari中似乎工作得很好。在Firefox 3.5中，服务器上的REQUEST_TYPE始终是'OPTIONS'， $_POST数据不会出现。Apache将请求记录为'OPTIONS'类型:

::1 - - [08/Jul/2009:11:43:27 -0500] "OPTIONS sitecodes.php HTTP/1.1" 200 46

为什么这个ajax调用可以在Safari中工作，但不能在Firefox中工作，我如何为Firefox修复它?

Response Headers
Date: Wed, 08 Jul 2009 21:22:17 GMT
Server:Apache/2.0.59 (Unix) PHP/5.2.6 DAV/2
X-Powered-By: PHP/5.2.6
Content-Length  46
Keep-Alive  timeout=15, max=100
Connection  Keep-Alive
Content-Type    text/html

Request Headers
Host    orderform:8888
User-Agent  Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1) Gecko/20090624 Firefox/3.5
Accept  text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language en-us,en;q=0.5
Accept-Encoding gzip,deflate
Accept-Charset  ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive  300
Connection  keep-alive
Origin  http://ux.inetu.act.org
Access-Control-Request-Method   POST
Access-Control-Request-Headers  x-requested-with

下面是Firebug输出的图片:

当前回答

罪魁祸首是使用OPTIONS方法的飞行前请求

对于可能对用户数据产生副作用的HTTP请求方法(特别是对于GET以外的HTTP方法，或者对于某些MIME类型的POST使用)，规范要求浏览器“预先处理”请求，使用HTTP OPTIONS请求方法从服务器请求受支持的方法，然后，在服务器“批准”后，使用实际的HTTP请求方法发送实际的请求。

Web规范参考:https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

我通过在Nginx conf中添加以下行来解决这个问题。

    location / {
               if ($request_method = OPTIONS ) {
                   add_header Access-Control-Allow-Origin  "*";
                   add_header Access-Control-Allow-Methods "POST, GET, PUT, UPDATE, DELETE, OPTIONS";
                   add_header Access-Control-Allow-Headers "Authorization";
                   add_header Access-Control-Allow-Credentials  "true";
                   add_header Content-Length 0;
                   add_header Content-Type text/plain;
                   return 200;
               }
    location ~ ^/(xxxx)$ {
                if ($request_method = OPTIONS) {
                    rewrite ^(.*)$ / last;
                }
    }

2016-04-22 15:04:47

其他回答

另一种绕过这个问题的方法是使用代理脚本。例如，这里描述了该方法

2010-08-04 12:26:26

我正在查看源代码1.3.2，当使用JSONP时，请求是通过动态构建一个SCRIPT元素发出的，它通过浏览器的同域策略。当然，您不能使用SCRIPT元素发出POST请求，浏览器将使用GET获取结果。

在请求JSONP调用时，不会生成SCRIPT元素，因为只有当AJAX调用的Type设置为GET时才会生成SCRIPT元素。

http://dev.jquery.com/ticket/4690

2009-09-22 19:51:10

我在Django端使用下面的代码来解释OPTIONS请求并设置所需的Access-Control头。在这之后，我的跨域请求从Firefox开始工作。如前所述，浏览器首先发送OPTIONS请求，然后立即发送POST/GET请求

def send_data(request):
    if request.method == "OPTIONS": 
        response = HttpResponse()
        response['Access-Control-Allow-Origin'] = '*'
        response['Access-Control-Allow-Methods'] = 'POST, GET, OPTIONS'
        response['Access-Control-Max-Age'] = 1000
        # note that '*' is not valid for Access-Control-Allow-Headers
        response['Access-Control-Allow-Headers'] = 'origin, x-csrftoken, content-type, accept'
        return response
    if request.method == "POST":
        # ...

编辑:似乎至少在某些情况下，您还需要在实际响应中添加相同的Access-Control报头。这可能有点令人困惑，因为请求似乎成功了，但Firefox并没有将响应的内容传递给Javascript。

2010-08-19 08:46:41

尝试添加以下选项:

数据类型：“json”

2009-07-10 12:51:32

我有同样的问题，发送请求到谷歌地图，解决方案是相当简单的jQuery 1.5 - dataType使用dataType: "jsonp"

2011-02-10 02:40:03

jQuery $.ajax()， $。post发送“OPTIONS”作为Firefox中的REQUEST_METHOD

推荐文章

最新文章

标签