Firefox即使服务器返回适当的响应头,也不允许CORS请求

时间:2014-11-18 18:59:51

标签: javascript ajax firefox cross-domain cors

我的应用程序使用CORS发出ajax请求,这可以在Chrome中使用,但不能在Firefox中使用。我跟着MDN CORS instructions,但它不起作用。

以下是我的代码的省略视图:

var href = ...
var request = new XMLHttpRequest();
request.open('GET', href, true);
request.setRequestHeader("Accept", "application/json");
request.onload = ...
request.onerror = ...
try {
  request.send();
} catch (e) {
  console.log(e.message);
}

这会导致NS_ERROR_DOM_BAD_URI异常,并显示消息“访问受限URI拒绝”和代码= 1012.

服务器正在使用我在Chrome中发出请求时验证的Access-Control-Allow-Origin: http://localhost:13000进行回复。我想查看FF中的响应标头,但是Web开发人员控制台只向我显示了javascript文件的GET请求,我看不到检查ajax请求和响应的标头。验证飞行前请求也很好,这应该是设置自定义标头的结果,但我看不到如何使用调试器访问它。

1 个答案:

答案 0 :(得分:1)

我终于找到了一个解决方案,这似乎表明了Firefox中的一个错误。

虽然我的示例代码中没有显示,但服务器需要HTTP BASIC身份验证,其提供如下:

request.open('GET', href, true, username, password);
request.withCrednetials = true;

这符合MDN specification for XMLHttpRequest

虽然这适用于Chrome,但使用Firefox会导致ajax请求未被发送(至少它不会出现在Firebug的控制台或网络窗格中)和send()方法会引发异常声明该请求是针对非法域名的。

以下解决方案适用于FF和Chrome:

var href = ...
var username = ...
var password = ...
var request = new XMLHttpRequest();
request.open('GET', href, true); //do not include credentials, or FF will fail to send the request
request.setRequestHeader("Accept", "application/json");
request.setRequestHeader("Authorization", "Basic " + btoa(username + ":" + password));
request.onload = ...
request.onerror = ...
try {
  request.send();
} catch (e) {
  console.log(e.message);
}

请注意,如果用户名和密码作为open()的参数提供,则Firefox无法发送请求并引发非法域异常,即使凭据是在Authorization标头中设置的。