从 url 加载 json 失败，从文件中工作答案

【问题标题】：Loading json fails from url, works from file从 url 加载 json 失败，从文件中工作
【发布时间】：2011-08-10 19:39:58
【问题描述】：

我有以下代码sn-p：

    $.getJSON("http://localhost:8080/images",
  function(data) {

    var items = [];

    $.each(data, function(key, val){
        items.push('<li id="' + key + '">' + val + '</li>');
    });

  $('<ul/>', {
    'class': 'my-new-list',
    html: items.join('')
  }).appendTo('body');

  });

url 返回类似于{"count" : 0} 的json。当我尝试在浏览器中加载页面时，.getJSON 调用失败。但是，当我将结果从“http://localhost:8080/images”保存到文件并尝试使用相同的 Javascript（url 替换为文件名）加载它时，一切都按预期工作，我得到了一个列表。

任何指针？

【问题讨论】：

运行脚本的端口和主机是否与http://localhost:8080/images的端口和主机匹配？
webkit/firebug 告诉你什么从服务器返回？ json 的 url 是否违反了同源策略？
是的，浏览器和服务（在 8080 上）都在本地主机上运行。我可以看到请求进来，服务用 {"count" : 0} 回答。当我直接在浏览器中输入 url 时也可见。

标签： jquery json

【解决方案1】：

您可能遇到了Same Origin Policy。在正常情况下，您只能使用“ajax”（即真正的XMLHttpRequest 调用）从与您的脚本运行的文档相同的origin 中检索资源。来源包括域、端口和协议。仅当文档本身是从本地文件（不是http URL）加载时，您才可以从本地文件加载它。详情见链接。

【讨论】：

我想我明白了。这意味着如果我让 Apache 提供相同的页面（而不是直接从文件中加载），它会起作用，对吧？
只要运行代码的页面是从以http://localhost:8080 开头的URL 提供的，您就可以在其上加载http://localhost:8080/images。但是如果代码运行的页面来自http://localhost（例如，端口80，而不是8080），或者如果它来自http://somewhere.else.com:8080（不同的域），你就会遇到SOP。（如果您将http 和https 混合使用，您也会成功。）