1

我正在尝试使用 jsonp 显示数据,但由于某种原因它不想显示在网页上。

function test() 
{
    $.ajax(
    {
        url: "http://localhost/api/company",  //web api is hosted on iss 8
        dataType: 'jsonp',
        success: function (data) 
        {
            $("#test").append(data[5].Company);
        }
    });
}

请注意从服务器返回的数据就好了。我通过谷歌浏览器执行测试功能并检查网络选项卡中的响应来测试这一点。

我在这里做错了什么?

4

1 回答 1

2

我建议您在此处阅读 JSON 和带有 Padding (JSONP) 的 JSON 之间的一个很好的解释,以便更好地理解正在发生的事情: 谁能用外行术语解释 JSONP 是什么?

首先是您的调用需要支持 JSONP 的 URL。并非所有 web 服务、rest 接口等都支持它,即使它们生成 JSON 也是如此

其次,您需要包含一个?callback=? 在您的 URL 中,以便使用来自 jquery 的 JSONP。

你添加 ?callback=? 到您的 URL,例如:

var url = 'URL?callback=?';
  $.getJSON(url, function(jsonp){
    $("#jsonp-response").html(JSON.stringify(jsonp, null, 2));
  });

您还需要测试实际服务是否支持 JSONP,您可以在浏览器中打开您的 web 服务并添加 ?callback=something

http://localhost/api/company?callback=callbackID

如果 API 支持 jsonp,您应该在浏览器中看到如下输出:

callbackID({
    JSON DOCUMENT HERE
});

在下一节中,我将包含一些链接,以显示什么是标准的纯 JSON 响应,以及什么是 JSONP 响应。

使用 Twitter API 的实时示例

当您使用 getJson 发送请求并有 ?callback=? jquery 会自动添加一个回调 id。

网络服务器收到一个请求,例如并使用回调名称(本例为“a”)包装数据:

http://search.twitter.com/search.json?since_id=91770779645124609&q=test&callback=a

如果您在没有回调的情况下尝试相同的请求,您只会看到无法跨站点使用的 JSON:

http://search.twitter.com/search.json?since_id=91770779645124609&q=test
于 2013-04-13T12:46:51.103 回答