アファメーションで独立・起業・夢実現。「いきなり！社長宣言！！」-“夢は口に出すことで実現する！”というアファメーション：ライブラリー
2008年1月28日
「Google AJAX Feed API」を使って外部RSSを読み込む。
夢実現のアファメーションを実践する起業家にもっとも読まれているブログは？
APIってすばらしい！
久しぶりの日記ですが…。
なんだか1月中はバタバタとしていて、やっとひと段落した感じ。
…まだ終わってないけど。...orz
今さらながら、いろいろとやったことの備忘録。
「Google AJAX Feed API」を使って外部RSSを読み込む。
以前から気になってたんだけど、別段使う必然性がなかった「Google AJAX Feed API」。（公開されたのが去年の4月だから、今さら…な感じですんません。汗）
今回、諸事情によりいろいろ調べて実験してみたけど…うんちくをたれるまでもなくチョー簡単っすね！
Googleアカウントの取得。
何はともあれ、「Google Analytics」やら「AdWords」やら「Google Maps」やら、GoogleのAPIサービスを使うのであれば必須になるので、アカウントの取得ページでとりあえず取っておくと便利。
Google API Keyのサインアップ。
んでもって、アカウントを取得したら次は「Google API Key」のサインアップです。
…といっても別にすごく難しいことがあるわけでもなく、サインアップ用のページで、使用許諾（“I have read and agree with the terms and conditions”って書いてあるところ）にチェックを入れて、自分のサイトのURLを入力するだけ。
あとはJSを貼り付けるだけ。
そうするとAPI Keyが生成されて、あとはサンプルで表示されているサンプルコード（htmlとJavaScript）を、ページに貼り付けるだけです。
コードはこんな感じ。
<script type="text/javascript" src="http://www.google.com/jsapi?key=YOUR API KEY"></script>
<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
var feed = new google.feeds.Feed("http://www.dokuritsu-kigyo.net/blog/index.xml");
feed.setNumEntries(7);//フィードの表示数の設定
feed.load(function(result) {
if (!result.error) {
var container = document.getElementById("feed");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
var div = document.createElement("div");
div.appendChild(document.createTextNode(entry.title));
container.appendChild(div);
}
}
});
}
google.setOnLoadCallback(initialize);
</script>
（とりあえず、デフォルトでは4つしか表示されないfeedを、「feed.setNumEntries(7);」で表示数を7つに指定してみる。）
うえのコードの「YOUR API KEY」のところに、吐き出されたAPIを入れて、「new google.feeds.Feed();」のカッコ内に引っ張りたいRSSを指定すれば完了。
あとはhtml内に「feed」というidを持ったdiv（<div id="feed"></div>）を用意すれば、その中に読み込んだRSSを展開してくれる。
※このとき、IE6（だからなのか？）でAPI Keyを取得すると、サンプルコードの空白文字部分が「＆nbsp;」（“＆”は半角）で表示されてしまうので注意が必要。
「Google AJAX Feed API」の素晴らしいところは、RSSのバージョンやら仕様をAPIの中で吸収してくれてるので、ほとんどのRSSを読み込んでくれること。
なので、ブログに限らずRSSを吐き出しているサイトだったら、そのRSSのフィードを指定すれば簡単に表示できちゃいます。（パチパチッ！）
多少カスタマイズは必要。
サンプルで吐き出されるhtmlは、一行ごとにdivで表示するみたいなので、あんまり美しく（？）ない。
なので、表示や吐き出されるデータをカスタマイズするには、JavaScriptやCSSの部分をごにょごにょとカスタマイズしないといけません。
んが、そのへんはいろんな人が自分用（？）にカスタマイズしたJSを公開しているので参考にすれば大丈夫。
ちなみに、カスタマイズに必要なCSSやJSの仕様などはこちら。
なにはともあれ、別ドメインで既にブログを立てていて、後から会社の静的なページや、他のサイトに記事を読み込みたい…なんて方はすっごくラクチンなので、ぜひお試しを。
参考サイト
この記事に関連する（かもしれない）書籍
投稿者 kuro : 2008年1月28日 20:23 | ID:757
