0

我创建了一个包含foo.html以下内容的 HTML 文件:

  <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script> 
      $.ajax({url:"http://foo.com/mdata",
        error: function (results) {
          alert("fail");
        },
        success: function (result) {
          alert("sucesses");
        }
      });
    </script>

当我在网络浏览器中加载这个 HTML 文件时,它总是显示一个失败的对话框。

  1. 知道为什么会这样吗?
  2. 还有什么是调试这个的最佳方法?

PS:

假设这http://foo.com/mdata是一个有效的 Web 服务路径。

编辑#1

解决方案

使用 $.getJson http://jsfiddle.net/dpant/EK3W8/的类似代码对我来说工作得很好

我也确实将内容保存为 .html 文件,并且从 file:// 到 Web 服务的请求似乎也有效。

<!DOCTYPE html>
<html>
<head>
  <style>img{ height: 100px; float: left; }</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <div id="images">

</div>
<script>
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
  {
    tags: "mount rainier",
    tagmode: "any",
    format: "json"
  },
  function(data) {
    $.each(data.items, function(i,item){
      $("<img/>").attr("src", item.media.m).appendTo("#images");
      if ( i == 3 ) return false;
    });
  });</script>

</body>
</html>

看起来大多数浏览器都支持 CROS,因此您可以编写一个脚本将其保存为 .html 并在浏览器中打开它,它会成功执行 Ajax 请求 *只要您发出请求的服务器支持它 *。在这种情况下,我的 Web 服务器(服务)不支持 CROS(并且 Apache 的默认配置不支持它)。

许多网络服务都启用了 CROS,例如http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?因此请求成功通过。

几个链接:

http://enable-cors.org/

https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS

http://en.wikipedia.org/wiki/Cross-Origin_Resource_Sharing

4

3 回答 3

3

它总是失败有两个原因:

  • 您需要一个响应您的请求的网络服务器(200 = 成功,404 即错误)在Linux上您可以轻松设置一个,在WindowsMac上查看 Bitnami
  • 您不能通过 AJAX 调用不同的域。如果您在 www.example.com 上运行脚本,则不能要求 www.example.net查看相同的来源策略
于 2013-02-03T08:28:41.533 回答
1

实际上,我们正在尝试跨域发送 AJAX 请求,这样它就会发生。我试过这段代码。在我的机器上它显示成功。

<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script> 
    $.support.cors = true;
      $.ajax({url:"http://www.google.co.in/",
        error: function (xhr, ajaxOptions, thrownError) {

            alert("fail");
            alert(xhr.status);
            alert(thrownError);
       },
        success:function(result){
              alert("sucesses");
        }
      });

    </script>

添加代码后代码可以正常$.support.cors=true工作,它肯定会为您工作。

于 2013-02-03T10:05:40.103 回答
0

正如我所知道的,在内容脚本中,您不能执行任何跨域 XHR。您必须在诸如背景、弹出窗口甚至选项的扩展页面中执行它们。

有关内容脚本限制的更多信息,请参阅Google 开发人员指南中的内容脚本页面。

有关 xhr 限制的更多信息,请参阅XHR 页面

于 2013-02-04T06:02:37.430 回答