通过jQueryAJAX从远程URL检索JSON数据

Question

我使用以下代码从URL获取数据。

$.ajax({
    url: 'http://183.77.251.173:90/api/function/getprice.aspx?code=1301&length=3M',
    success: function (data) {
        alert(data.results[0].address_components[0].long_name);
    },
    error: function (jqXHR, exception) {
        alert(jqXHR.status);
    }

然而，它抛出一个状态代码为0的错误。我不知道这是什么原因？我也尝试设置crossDomian:true，但它仍然抛出相同的错误。

我还将URL修改为http://www.google.com，它也返回了0的错误状态代码。为什么？原因是什么？从远程URL获取数据的正确方法是什么？

Answer 1

除非使用JSONP或CORS，否则无法进行跨域请求。这些信息的可用性将取决于您请求信息的域的API。

这是现代浏览器的一个安全功能，称为同源策略。

Answer 2

查找带填充的JSON（或JSONP），因为您使用jQuery，所以您应该看看这里：http://api.jquery.com/jQuery.getJSON/

从该网站被盗的例子：

<script>
(function() {
  var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
  $.getJSON( flickerAPI, {
    tags: "mount rainier",
    tagmode: "any",
    format: "json"
  })
  .done(function( data ) {
    $.each( data.items, function( i, item ) {
      $( "<img/>" ).attr( "src", item.media.m ).appendTo( "#images" );
      if ( i === 3 ) {
        return false;
      }
    });
  });
})();
</script>

编辑：

一个自制的例子，使用jquery.jsonp-2.4.0以获得更好的错误响应(https://github.com/jaubourg/jquery-jsonp/downloads)。但是您也可以使用普通的jQuery。

在客户端，你需要这样的东西：

$.jsonp({
    "url": target_url+"ping.php?callback=?",
    "success": function(data) {
        // print out data
    },
    "error": function(d,msg) {
        // error
    }
});

目标服务器上的ping.php文件：

<?php
    echo $_GET['callback'] . '(' . "{'response' : 'success'}" . ')';
?>

Answer 3

正如其他人所说，您收到错误0是因为无法访问该网站。跨站点问题是一个原因。当然，这是一个不正确的URL。如果你试图访问的URL确实有效，并且位于与你的网站不同的域上，那么是的，你有跨域问题。

JSONP将是让它发挥作用的唯一方法，但也有缺点。看看SO上的这篇帖子，了解详细解释：

JSONP的全部内容是什么？

文章中还有一个链接http://www.json.org/JSONRequest.html.我还没有尝试过，所以不确定它是否有效。

这应该对你有帮助。

Answer 4

对于跨域使用$.getJSON()。

$.getJSON('http://183.77.251.173:90/api/function/getprice.aspx?code=1301&length=3M', function(data){
alert(data.results[0].address_components[0].long_name);
});