Movable Type 備忘録

Google AJAX Feed API

こんにちわ^^

今日は昨日までとは違って東京は暖かかったです(●´∀｀●)
学生の頃の友人たちと上野で飲んできました。

福島からわざわざこの日の為に東京に来た友人もいて、学生の頃の思い出話に華咲きました。
みんなの近況が聞けて楽しかったです。わたしもがんばらなきゃ･･･と思う今日この頃です。

さて、先日Google AJAX Feed APIってのが公開されました。

どんなAPIかというと、お気に入りブログのRSSやAtomの一般的なFEEDをカンタンに取得することができるAPIみたいです。

さっそくわたしも使ってみましたのでご紹介します。

このAPIを使えば、クロスドメインの制約を気にすることなく、他サイトのFEEDを利用することができるようです。

まずはサンプルですね (￣∇￣)b
サンプルとして、いつもお世話になってるぷーこさんとTAEKOさんのサイトのFEEDを表示させてみました。

まず、Google AJAX Feed APIからStart using the Google AJAX Feed APIをクリックして、以下のことを行います。
- 「I have read and agree with the terms and conditions」にチェック
- 「My web site URL」に各自のサイトのURLを入力
- 「Generate API Key」をクリック
そうすると、Googleアカウントでのログインを促されますので、ログインします。
Googleアカウントをお持ちでない人は、こちらから登録できます。
結果、以下の情報がもらえます。
- Your key is:
  API Keyになります。
- This key is good for all URLs in this directory:
  先ほど入力した、各自のサイトのURLが表示されます。
- Here is an example web page to get you started:
  FEEDを表示するためのサンプルHTMLになります。
  先ほどわたしが例として示したのは、このHTMLをカスタマイズしたものです。
あとは、サンプルHTMLをお好みでカスタマイズするなどして、表示させてたいページの</body>タグの上辺りに追加することでお気に入りサイトのFEEDを表示させることができました。

ちなみに、例として示したお気に入りサイトの一覧は以下のコードになります。

<script type="text/javascript" src="http://www.google.com/jsapi?key=YOUR API KEY"></script>
<script type="text/javascript">
var urls = new Array("http://feeds.feedburner.jp/EgoecoDays",
"http://taeko.w-museum.com/wing/index.xml");
google.load("feeds", "1");
function initialize() {
var container = document.getElementById("google-feed");
container.innerHTML = "<dl>";
for (var n = 0; n < urls.length;n++ ) {
var feed = new google.feeds.Feed(urls[n]);
feed.setNumEntries(5);
feed.load(function(result) {
if (!result.error) {
container.innerHTML += "<dt><a href='" + result.feed.link + "'>" + result.feed.title + "<\/a><\/dt>";
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
container.innerHTML += "<dd><a href='" + entry.link + "'>" + entry.title + "<\/a><\/dd>";
}
}
});
}
container.innerHTML += "<\/dl>";
}
google.setOnLoadCallback(initialize);
</script>