Wikipedia APIで遊んでみた
使い方
http://ja.wikipedia.org/w/api.php?action=query&list=random&rnnamespace=0&rnlimit=10
にアクセスすればXML。
http://ja.wikipedia.org/w/api.php?action=query&list=random&rnnamespace=0&rnlimit=10&format=jsonfm
formatにjsonfmを指定すれば読みやすいpretty JSONで表示してくれる。デバッグ時によい。
http://ja.wikipedia.org/w/api.php?action=query&list=random&rnnamespace=0&rnlimit=10&format=json&callback=callback
JSONPで使う場合はformatをjsonにして、callbackが必要なら付けられる。
Demo
Wikipedia APIを使ってランダムに記事を表示させるサンプル。
- http://cherenkov.github.com/contents/ja.infinipedia.org/
- http://cherenkov.github.com/contents/en.infinipedia.org/
<html> <head> <meta charset="utf-8" /> <title>ja.infinipedia.org</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <script> $(function() { var titles = []; function stock() { $.ajax({ type: "get", dataType: "jsonp", url: "http://ja.wikipedia.org/w/api.php?action=query&list=random&rnnamespace=0&rnlimit=10&format=json", success: function(json) { $.each(json.query.random, function(i, e) { titles.push(e.title); }); $(document.body).trigger('wikijump'); console.log(titles) } }); } $(document.body).bind('wikijump', function() { if (titles.length > 1) { var title = titles.shift(); setTimeout(function() { $('#wikiframe').attr('src', 'http://ja.wikipedia.org/wiki/' + encodeURIComponent(title)); $(document.body).trigger('wikijump'); console.log(titles) }, 8000); } else { stock(); } }); stock(); }); </script> </head> <body> <iframe id="wikiframe" src="http://ja.wikipedia.org/wiki/%E7%89%B9%E5%88%A5:%E3%81%8A%E3%81%BE%E3%81%8B%E3%81%9B%E8%A1%A8%E7%A4%BA" width="100%" height="100%"></iframe> </body> </html>
まとめ
JSONPでクロスドメインの楽しさがやっと理解できた。MacBook Air 11インチ欲しい!