有什么问题,我认为是一个相对简单的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输出的图片:


当前回答

您需要在服务器端做一些工作。我看到你在服务器端使用PHP,但解决方案。net web应用程序在这里: 在jQuery.ajax中不能将content-type设置为application/json

在PHP脚本中执行同样的操作,它将工作。简单地说:第一次请求浏览器询问服务器是否允许以这种类型发送这样的数据,第二次请求是适当的/允许的。

其他回答

我在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。

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

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

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

我已经使用完全基于apache的解决方案解决了这个问题。在我的vhost / htaccess我把下面的块:

# enable cross domain access control
Header always set Access-Control-Allow-Origin "*"
Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS"

# force apache to return 200 without executing my scripts
RewriteEngine On
RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule .* / [R=200,L]

您可能不需要后一部分,这取决于Apache执行目标脚本时会发生什么。后面的部分要归功于友好的ServerFault人员。

我们在ASP.Net上也遇到过类似的问题。我们的IIS在试图执行jQuery $时返回一个内部服务器错误。由于PageHandlerFactory被限制只响应get,HEAD, post,DEBUG动词,post来获取一些html内容。所以你可以改变这个限制添加动词OPTIONS到列表中或者选择All Verbs

你可以在你的IIS管理器中修改它,选择你的网站,然后选择处理程序映射,双击你的PageHandlerFactory *。apx文件作为您需要的(我们使用集成应用程序池与框架4.0)。点击Request Restrictions,然后转到Verbs Tabn,应用你的修改。

现在我们的$。Post请求按预期工作:)

响应脚本顶部的PHP似乎可以工作。(使用Firefox 3.6.11。我还没有做很多测试。)

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST, GET, OPTIONS');
header('Access-Control-Max-Age: 1000');
if(array_key_exists('HTTP_ACCESS_CONTROL_REQUEST_HEADERS', $_SERVER)) {
    header('Access-Control-Allow-Headers: '
           . $_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']);
} else {
    header('Access-Control-Allow-Headers: *');
}

if("OPTIONS" == $_SERVER['REQUEST_METHOD']) {
    exit(0);
}