書籍”公開API活用ガイド”の第10章：twitterを読んで実践。6〜9章は10章終わったときにどうしようか考える。
書籍では、キーワード”工学社”の検索結果を一覧表示するプログラムを解説していた。
メモ
- twitter APIには”Search API Methods”と”REST API Methods”がある
- リクエストURLの形式：http://search.twitter.com/search.[format]?[parameter]…
- formarは”json”か”atom”を指定。今回はjson
- 検索クエリはURLエンコードする必要がある
フォームに入力したワードを検索した結果を一覧表示するページ：twitter_jsonp.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>twitter API practice</title>
</head>
<body>
<h1>twitter search API JSONP sample</h1>
<input type="text" id="keyword" size="35" maxlength="255" value="" />
<input type="button" onclick="search_twitter();" value="search" />
<script type="text/javascript">
<!--
function search_twitter() {
var text = document.getElementById('keyword').value;
if (text) {
var url = "http://search.twitter.com/search.json?callback=callbackFunc&lang=ja&locale=ja&q=" + encodeURI(text);
callJSONP(url);
}
}
function callJSONP(url) {
var target = document.createElement('script');
target.src = url;
document.body.appendChild(target);
}
function callbackFunc(data) {
var temp = '';
var container = document.getElementById("search");
for (var i in data.results) {
temp += "<img src="" + data.results[i].profile_image_url + "">";
temp += data.results[i].text + "<br>n";
temp += '<a href="http://twitter.com/' + data.results[i].from_user + '/status/' + data.results[i].id + '">' + data.results[i].created_at + "</a><br /><br />n";
}
container.innerHTML = temp;
}
//-->
</script>
<div id="search"></div>
<p>powered by <a href="http://twitter.com/">twitter</a></p>
</body>
</html>
公開API活用ガイド (I・O BOOKS)
posted with amazlet at 12.01.24
ZAPA
工学社
売り上げランキング: 149253
工学社
売り上げランキング: 149253
関連エントリー
