Question

我正在尝试使用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);
        }
    });
}

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

我在这里做错了什么？

Answer 1

我建议你在这里阅读JSON和JSON与Padding（JSONP）之间的一个很好的解释，以便对正在发生的事情有一个很好的理解： Can anyone explain what JSONP is, in layman terms?

首先关闭您的呼叫需要支持JSONP的URL。并非所有的webservices，rest接口等都支持它，即使它们产生JSON 。

其次，您需要在网址中加入？callback =？，以便从jquery中使用JSONP。

你添加？callback =？到您的网址，例如：

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

您还需要测试实际服务是否支持JSONP，并且您可以在浏览器中使用？callback =添加的内容在您的网络服务中打开

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

在网页上显示jsonp数据

1 个答案: