使用JSONP从另一台服务器获取JSON数据

use*_*416 8 html javascript jquery json jsonp

我正在尝试从公司托管的网站收集JSON数据.我不在同一个域,所以我不能只访问它.从标题看,它们似乎也不使用CORS.所以我尝试使用JSONP来解析数据,但它似乎不起作用.我已经尝试过$ .getJSON和$ .ajax,但是那些抛出错误并且不调用函数.这是我迄今为止的解决方案,在服务器的响应中,它仍然没有将数据包装在getResults中.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<script type="text/javascript" src="jquery/js/jquery-1.9.0.min.js"></script>

<script>
function getResults(data) {
    console.log(data[0].name);
}
</script>
<script type='text/javascript' src='https://solstice.applauncher.com/external/contacts.json?callback=getResults'></script>
Run Code Online (Sandbox Code Playgroud)

我是HTML,JavaScript和jQuery的新手,所以我真的很困惑为什么响应被包装在函数中并且控制台日志不起作用.任何帮助,将不胜感激.

Har*_*and 5

您可以使用多种方法,但两个最方便的方法是AJAX调用或使用jQuery的getJSON()方法

使用AJAX调用

$(document).ready(function() {
  $(".btn").click(function() {
    $.ajax({type: "get",
            url: "http://api.forismatic.com/api/1.0/",
            data: {method: "getQuote",format: "jsonp",lang: "en"},
            dataType: "jsonp",
            jsonp: "jsonp",
            jsonpCallback: "myJsonMethod"
    }); 
  });
});
function myJsonMethod(response){
  console.log (response);
}
Run Code Online (Sandbox Code Playgroud)

在上面的方法中response Object有来自API调用的所有JSON数据.

使用getJSON()

$(document).ready(function() {
  $(".btn").click(function() {
    $.getJSON("http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=myJsonMethod&?callback=?");
  });
});
function myJsonMethod(response){
  console.log (response);
}
Run Code Online (Sandbox Code Playgroud)

在上面的方法中,同样的事情发生了.

注 - > JSONP采用要在其上发送响应的回调函数的名称.


jfr*_*d00 2

JSONP 是一种技术,您可以将请求放入脚本标记 URL(允许任何域)中,并在该 URL 中传递一个参数,该参数指示您希望返回的结果脚本调用的函数的名称,并且将您的数据传递给它。在本例中,您似乎指定了回调函数名为getResults

为了使 JSONP 工作,您发送请求的服务器必须专门支持它,因为它需要特定类型的响应格式,并且它允许来自任何浏览器的任何域发出请求,但这并不是所有站点都希望启用的。

因此,您需要了解的第一件事是您请求数据的服务器是否支持 JSONP,如果支持,请确保您准确了解它将如何格式化响应以及它期望回调函数如何指定(常见约定是使用callback=xxxURL 参数,但不必这样做。

如果您想要从中获取数据的服务器不支持 JSONP,那么您就无法使用 JSONP 从中获取数据。如果它不支持其他跨域请求策略,那么您将无法通过浏览器网页从中获取数据,并且必须从浏览器以外的其他设备(例如另一台服务器)发出请求。