用jQuery消费web服务

Question

我试图运行下面的代码，但什么也没有发生。

在开发人员选项中，我在Firefox/Chrome上没有收到任何错误消息。

知道我做错了什么吗？

$(document).ready(function () {

    jQuery.support.cors = true;

    var AltCoin = "ripple";
    //var api_url = "https://api.coinmarketcap.com/v1/ticker/" + AltCoin;
    var api_url = "https://api.coinmarketcap.com/v1/ticker/";

    $.ajax({
        method: "GET",
        dataType: "jsonp",
        url: api_url,
        data: AltCoin,
        success: function(data) {
            try {                                   
                $('#coin_value').html(data);
            }
            catch (error) {
                alert('error found');                                
            }
        }
    });
});

<article class="article">
    <h1>Ripple</h1>
    <p id="coin_value">test</p>
    <p></p>
    <p><strong></strong></p>
</article>

剧本是非常基础的。

Answer 1

问题在于调用的API以JSON格式返回数据，而不是JSONP。它们是不可互换的。

若要解决此问题，请将dataType: 'jsonp'更改为dataType: 'json'。试试这个：

​

var AltCoin = "ripple";
var api_url = "https://api.coinmarketcap.com/v1/ticker/";

$.ajax({
  method: "GET",
  dataType: "JSON",
  data: AltCoin,
  url: api_url,
  success: function(data) {
    console.log(data);
    //$('#coin_value').html(data);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<article class="article">
  <h1>Ripple</h1>
  <p id="coin_value">test</p>
  <p></p>
  <p><strong></strong></p>
</article>

​

您需要在success处理程序中循环遍历生成的对象，并以所需的格式追加数据。

还请注意，如果您调用https://api.coinmarketcap.com/v1/ticker/ripple --就像您似乎想要的那样，但是代码没有这样做--那么您将被CORS阻塞。