未使用 Javascript 访问 JSON 文件 [重复]

Question

可能重复：
Accessing JSON service from localhost or file://

<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script>
$.getJSON('http://game4u.comuf.com/songs.json', function(data) { 

  var output = data.music[0].url; 
  document.getElementById("placeholder").innerHTML = output;

});
</script>

但是当我运行它时，我的 JSON 文件 ( music[0].url ) 没有显示在浏览器中。我在本地运行 HTML，而不是在与网站相同的服务器上。

Answer 1

我在本地运行 HTML，而不是在与网站相同的服务器上。

这就是问题所在。 getJSON 是一个“ajax”调用，它们受Same Origin Policy 的限制。您的本地文件系统与 http://game4u.comuf.com/songs.json 的来源不同（尽管有些浏览器将本地文件系统视为匹配 any 来源；大多数不匹配）。

如果您控制http://game4u.comuf.com/songs.json 处的内容，则可以使用JSON-P 代替JSON。 JSON-P 围绕 SOP 工作。另一个选项是Cross-Origin Resource Sharing，它还要求服务器端做一些事情（在这种情况下，授予对源“null”的访问权限）并且还要求您使用支持它的浏览器（所有现代浏览器都这样做，IE9 仅在您可以解决它要求您使用 XDR 而不是 XHR 对象的事实；这是 jQuery 不为您做的事情，尽管有插件可以）。

---

另外，正如 Musa 指出的那样，您的 JSON 无效。如果您更正了 URL 中的反斜杠（它们应该是斜杠 [/]，而不是反斜杠 [\]）并且如果您删除了列表末尾的尾随 ,，这将是有效的，这不是在 JSON 中有效。