无法让jQuery从另一个域获取JSON(使用JSONP) [英] Can't get jQuery to get JSON from another domain (using JSONP)

查看:84
本文介绍了无法让jQuery从另一个域获取JSON(使用JSONP)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用一个API(我制作并在必要时可以更改),它会吐出一些JSON(使用PHP的json_encode,因此它是有效的)。我在另一个域上的另一个网站上使用它来检索数据。

I'm using an API (which I made and can alter if necessary) which spits out some JSON (using PHP's json_encode, so it's valid). I'm using it on another website on another domain to retrieve data.

不幸的是,我似乎无法让它工作。请求已经完成,我可以从Chrome开发人员工具中检索数据(结果已从API下载)。似乎没有进一步处理。

Unfortunately, I can't seem to get it to work. The request is made, and the data is retrieved as far as I can tell from the Chrome developer tools (the results have been downloaded from the API). No further processing seems to happen though.

请求URL如下所示(用实际查询替换'query',在本例中为带名):

The request URL looks like this (replacing 'query' with the actual query, in this case a band name):

http://gatekrash.com/api/v1?t=search&s=national&p=0&n=15&q=QUERY&callback=?

链接到结果页面,查询为Noah and the Whale

结果看起来像这样(有效的JSON):

The results look like this (valid JSON):

[{"id":"4123","title":"Noah And The Whale","type":null,"start":"2011-03-30 19:30:00","end":"2011-03-31 00:30:00","venue":{"id":"154","name":"The Deaf Institute"},"place":{"id":"17374","name":"Manchester"},"source_count":"1","performers":""},{"id":"9317","title":"Noah And The Whale","type":null,"start":"2011-05-04 19:00:00","end":"2011-05-05 00:00:00","venue":{"id":"539","name":"Leeds Metropolitan University"},"place":{"id":"15473","name":"Leeds"},"source_count":"1","performers":""}]

jQuery I' m用于获取此数据如下所示:

The jQuery I'm using to fetch this data looks like this:

$(document).ready(function(){
    getSearch("Noah and the Whale");
});
$(document).ready((function(query) {
getSearch = function(query) {
    url = "http://gatekrash.com/api/v1?t=search&s=national&p=0&n=15&q=" + query + "&callback=?";
    $.getJSON(url,
        function(json) {
            alert("Success!");
        }
    );
}
})());

据我所知,这个应该有效。我在API所属的网站上使用基本相同的代码(减去回调=?)来检索数据没有问题,所以我认为这可能是跨域的事情。

As far as I'm aware, this should work. I'm using basically the same code (minus the callback=?) on the site to which the API belongs to retrieve data with no problems, so I think that it's probably a cross-domain thing.

解决方案可能绝对是一件非常明显和简单的事情,但是我没有取得任何成功。

The solution is probably definitely something so obvious and simple and in my face, but I've not had any success in getting it to work.

任何想法?

推荐答案

您需要回调才能使跨域JSONP正常工作。

You need a callback for cross domain JSONP to work.

'P'代表'Padded';即带有函数调用。为了解决跨域策略,对于每个JSONP请求,jQuery在DOM中创建一个脚本标记,并将请求的URL作为源。 JSON被加载到脚本标记中然后执行,就像任何其他脚本一样。问题是执行一个对象并没有那么做,所以代替一个函数调用,以便将对象作为参数传递给该回调。

The 'P' stands for 'Padded'; namely with a function call. To get around the cross domain policy, for each JSONP request jQuery makes a script tag in the DOM with the URL of the request as the source. The JSON gets loaded into the script tag and then executed, just like any other script. The issue is that executing an object doesn't do very much so instead a function call is wrapped around it so that the object is passed as an argument to that callback.

JSON :(通常使用XMLHttpRequest等将文本直接加载到javascript中)

JSON: (usually loaded as text directly into javascript using XMLHttpRequest or the like)

{ "really":"simple", "example":"object" }

JSONP :(通常加载到脚本标记中以避免跨域策略)

JSONP: (usually loaded into script tag to avoid cross-domain policy)

nameOfCallback({ "really":"simple", "example":"object" })

当JSONP加载时,后者会调用方法'nameOfCallback',将对象作为唯一参数传递。

The latter would call the method 'nameOfCallback' when the JSONP loads, passing the object as the only parameter.

对于未来的googlers,这个这个答案可能会提供更多帮助。

For future googlers, this this answer may provide more help.

这篇关于无法让jQuery从另一个域获取JSON(使用JSONP)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆