javascript - JQueryを使用したSongkick API

原文 javascript jquery json api getjson

Songkick APIでJSONを使用してデータを収集する際に問題が発生します。私はjQueryとJavascriptを初めて使用するので、これが本当に大雑把に見えても許してください。私は必要な適切な構文を調査するためにしばらく時間を費やしましたが、ただ1に戻るだけです。

私がやろうとしていることは、jQueryを使用してリクエストを作成し、その結果をリストのHTMLに追加することです。誰かが私に与えることができるどんな助けも素晴らしいです。

ここに私が持っているものがあります。

<script>
$.getJSON("http://api.songkick.com/api/3.0/artists/3950031/calendar.json?apikey={apikey}",
function(data){
var events = data['resultsPage']['results']['event'];
for (var i=0;i < events.length; i++) {


$("#events").append('<li><a
href="'+events[i]['uri'])+'">'+events[i]['displayName']+'</a></li>');
}

}); 

</script>

ありがとう!

答え

すみません、戻るのに時間がかかりすぎて、昨夜あなたが返事をした頃にオフィスを出ました

これが私が思いついたものです:

  $(document).ready(function() {
  $.ajax({
  url:  "http://api.songkick.com/api/3.0/artists/480448/calendar.json?apikey=APIKEY&jsoncallback=?",
  dataType:   "jsonp", // <== JSON-P request
  success:    function(data){ 
    $.each(data["resultsPage"]["results"]["event"], function(i, entry){
        $("#events").append('<li><a href="' + entry.uri+'">'+entry.displayName +'</a></li>');
    });
  }     
  });
  });

あなたが持っていた問題はJSONに関するものだと思います、JSONは同じ起源ポリシー(私がここで読んだ($.getJSON not working)の影響を受けます。代わりにJSON-Pを使用する必要があります

   &jsoncallback=?

URLの最後にあるSongkickに、JSON-Pリクエストとして送信するように指示します。これが主な問題でした。

その他の問題には、軽微なコーディングエラーが含まれていました。追加の文字列がありました(追加文字列で、$も使用しました。それぞれforforループへのApposeとして機能しますが、どちらも機能します。動作しました:) APIキーを自分のキーに変更するだけで問題ありません(他のバンドにはエントリがないため、バンドをchevelleに変更しました)。

関連記事