Question

我正在使用jsonp和ajax来查询在另一台服务器上用java编写的web服务。我使用以下jquery命令：

$.ajax({
    type: "GET",
    url: wsUrl,
    data: {},
    dataType: "jsonp",
    complete: sites_return,
    crossDomain: true,
    jsonpCallback: "sites_return"
});


function jsonp_callback(data) {
    console.log(data);
}

function sites_return(data) {
    console.log(data);
}

所以我的问题是在查询完成后调用一个名为jsonp_callback的函数。我可以清楚地看到json格式的字符串：

{"listEntries":["ELEM1", "ELEM2", "ELEM3", etc...]}

但是在完成事件触发后调用函数sites_return之后，我得到以下内容：

Object { readyState=4, status=200, statusText="parsererror"}

同样作为参考，在sites_return函数之前调用jsonp_callback函数。此外，如果我从代码中取出jsonp_callback函数，我会向firebug投诉该函数未实现。

我的问题三折： 1）我在jquery方面做错了什么？ 2）为什么json在jsonp_callback中正确解析而不是sites_return？ 3）我该怎么做才能解决这些问题？

修改

一些新的发展。根据这里的评论是一些额外的信息。

以下是http响应

的内容

jsonp_callback({"listEntries":["ELEM1", "ELEM2", "ELEM3"]})

我认为这就是调用jsonp_callback的原因。我想现在我的问题变成了，有没有办法控制它（假设我无法访问后端Web服务）。

Answer 1

希望这会有所帮助〜

var url = "http://maps.google.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&sensor=false";
var address = "1600+Amphitheatre+Parkway";
var apiKey = "+Mountain+View,+CA";

$.getJSON("http://maps.google.com/maps/geo?q="+ address+"&key="+apiKey+"&sensor=false&output=json&callback=?",
  function(data, textStatus){
     console.log(data);
  });

Answer 2

我相信sites_return函数的第一个参数是jqXHR对象。而不是complete尝试使用success。

但是这仍然可能不起作用，因为似乎存在解析错误（在oncomplete中调用的sites_return函数的返回值中提到）。因此，您首先需要检查您的json字符串。

要验证JSON，您可以使用http://jsonlint.com/

Answer 3

我认为问题在于您的服务器的行为方式与jQuery所期望的不同。 JSONP“协议”不是很稳定，但通常应该发生的是网站应该查找“回调”参数并在构建JSONP响应时将其用作函数名称。看起来您的服务器总是使用函数名称“jsonp_callback”。

直接告诉jQuery你的回调是“jsonp_callback”可能会有用：

$.ajax({
    type: "GET",
    url: wsUrl,
    data: {},
    dataType: "jsonp",
    complete: sites_return,
    crossDomain: true,
    jsonpCallback: "jsonp_callback"
});

然而，不是100％肯定。

Answer 4

如果您无法更改远程服务器返回的JSONP函数包装器，那么jQuery的$.ajax()可能过度杀伤。最后，您所做的就是为wsUrl注入脚本引用，该引用使用JavaScript对象文字作为输入参数调用jsonp_callback。

你可以轻松地做这样的事情，避免围绕回调命名/语法的混淆：

$.getScript(wsUrl);

function jsonp_callback(response) {
  // Access the array here via response.listEntries
}

遇到jQuery，ajax和jsonp的问题

4 个答案: