Javascript 如何正确可靠地跨站点加载JSON数据？

我目前正在为Chrome开发一个userscript/扩展，并试图从“某个网站”中获取一些JSON数据。这就是我的方法：

$.get( "http://cloud.hartwig-at.de/~oliver/superuser.json", 
       function( data ) { console.log( data ); } 
);

当然，这会导致以下错误：

无法加载XMLHttpRequest。访问控制不允许原点允许原点

我在阅读后（以及其他问题）能够解决这个问题。这是下一个版本：

$.get( "http://cloud.hartwig-at.de/~oliver/superuser.json", 
       function( data ) { console.log( data ); }, 
       "jsonp" 
);

不幸的是，这导致了另一个错误：

未捕获的语法错误：意外标记：（superuser.json:2）

还有一条警告告诉我“资源被解释为脚本，但使用MIME类型text/plain传输：”这已经让我知道了问题可能是什么。（更多详细信息通过提供）

显然，对于我的档案来说，那是

好的，所以我很快添加了我的

mime.types

，然后又进行了一次尝试。但是，没有骰子！警告消失了，错误没有消失。我仍然得到

未捕获的语法错误：意外标记：

。（我之前也曾尝试利用解决方案来解决这个问题，结果是一样的。）

MIME类型看起来不错：

---

现在我有些不知所措了。

.json

文件的内容在告诉jQuery的get to do JSONP并不能神奇地使其工作时，验证了fine。它会产生错误，但另一端的服务器需要支持JSONP调用

来自服务器的响应应该类似于

someFunction( { "foo" : "bar" } );

请参阅with JSONP以了解如何使用回调

如果它是一款现代浏览器，您可以使用它，并且您可以控制第二个域

---

另一个选项是域上的服务器端代理，它从另一个域请求数据。或者您可以使用类似的服务

告诉jQuery的get to do JSONP并不能神奇地让它工作。它会产生错误，但另一端的服务器需要支持JSONP调用

来自服务器的响应应该类似于

someFunction( { "foo" : "bar" } );

请参阅with JSONP以了解如何使用回调

如果它是一款现代浏览器，您可以使用它，并且您可以控制第二个域

---

另一个选项是域上的服务器端代理，它从另一个域请求数据。或者您可以使用类似的服务

除非服务器支持，否则不能对请求使用JSONP。JSONP调用work的方式是，您将

callback=something

参数与请求一起传递，服务器使用

something（）

封装JSON，以便在访问脚本时，浏览器可以通过调用

something

加载它

另一种使其工作的方法是，如果您拥有该域，则配置该服务器以正确设置CORS头

如果你没有访问服务器，考虑一下，它为你包装了第一步。我已经使用YQL来实现这一点（参见链接），这不需要我自己设置任何东西。下面是执行此操作的coffeescript代码：

uri = "http://cloud.hartwig-at.de/~oliver/superuser.json"      

jqxhr = $.getJSON \
  "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22" \
    + encodeURIComponent(uri) + "%22&format=json&callback=?"  

jqxhr.success (yql) ->
  unless yql.query.results
    alert("Failed to get stuff")
    return      
  json = $.parseJSON(yql.query.results.body.p)
  # do stuff with json

并以javascript的形式使用：

---

除非服务器支持，否则不能对请求使用JSONP。JSONP调用work的方式是，您将

callback=something

参数与请求一起传递，服务器使用

something（）

封装JSON，以便在访问脚本时，浏览器可以通过调用

something

加载它

另一种使其工作的方法是，如果您拥有该域，则配置该服务器以正确设置CORS头

如果你没有访问服务器，考虑一下，它为你包装了第一步。我已经使用YQL来实现这一点（参见链接），这不需要我自己设置任何东西。下面是执行此操作的coffeescript代码：

uri = "http://cloud.hartwig-at.de/~oliver/superuser.json"      

jqxhr = $.getJSON \
  "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22" \
    + encodeURIComponent(uri) + "%22&format=json&callback=?"  

jqxhr.success (yql) ->
  unless yql.query.results
    alert("Failed to get stuff")
    return      
  json = $.parseJSON(yql.query.results.body.p)
  # do stuff with json

并以javascript的形式使用：

---

以返回正确jsonp的服务器端脚本（asp、php等）为目标，或者使用静态回调并告诉jQuery使用它。如果你不知道我在说什么，就研究一下jsonp是什么。jsonp涉及json，但它们不是同一个。针对返回正确jsonp的服务器端脚本（asp、php等），或者使用静态回调并告诉jQuery使用它。如果你不知道我在说什么，就研究一下jsonp是什么。jsonp涉及json，但它们不是一个，这就解释了很多“告诉jQuery的get to do JSONP并不能神奇地让它工作”，这解释了很多；）使用中概述的YQL方法可以让我快速解决这个问题。谢谢。我发布了我自己的代码，因为如果我没记错的话，在这个问题上使用一字不差的代码对我不起作用。作为将来的参考，在使用YQL时，最好也通过，以避免有损数据转换。在我的例子中，省略参数会导致JSON对象中的键在包含某些字符时发生更改。谢谢。我发布了我自己的代码，因为如果我没记错的话，在这个问题上使用一字不差的代码对我不起作用。作为将来的参考，在使用YQL时，最好也通过，以避免有损数据转换。在我的例子中，省略参数会导致JSON对象中的键在包含某些字符时发生更改。