Google Ajax Feed APIはかなり便利。

基本はブログのRDFファイルを他ドメインのサイトで利用するためのものです。

Google AJAX Feed API
http://code.google.com/apis/ajaxfeeds/

サンプルを見るとDOMで自作しないといけないので、かなり面倒な印象を受けるんですが、それをいっそのこと、Spryと組み合わせたら、楽じゃないの? ということで、Spryとの組み合わせてみました。

Google AJAX Feed APIのデフォルトはJSONで処理するので、SpryもJSONで処理できるように

var Feeds = new Spry.Data.DataSet();

と設定。

JSONデータは、空の配列を用意し、そこに読み込ませる。

以下は、Google AJAX Feed APIのデフォルトの書き方をアレンジしてSpryと組み合わせたもの。

var Feeds = new Spry.Data.DataSet();
var entry = [];

function initialize() {
var feed = new google.feeds.Feed("読み込むファイル");

feed.load(function(result){
if(!result.error){
for (var i = 0; i < result.feed.entries.length; i++) {
entry[i] = result.feed.entries[i];
}

Feeds.data = entry;
Feeds.dataHash = entry;
Feeds.loadData();
}
});

}
//ここでfunction終わり

google.setOnLoadCallback(initialize);

ポイントはfeed.load()内の処理。この中の赤字の部分がSpryの部分。

あとはドキュメントにSpryの読み出しを書くが、JSON形式にする際に、Google AJAX Feed APIはフォーマットを以下のノードで書き直すそうなので、それに合わせてHTMLタグを書く。

  • title‥‥‥Atomの <title> RSSの<title>
  • link‥‥‥Atomの<link>、RSSの<link>
  • content‥Atomの<content> または <summary>、RSSの<description>
  • contentSnippet‥Atomの<content> または <summary>、RSSの<description>で、HTMLを削除して、120文字までを表示。
  • publishedDate‥Atomの<published>、RSSの<pubDate> ようは時間。普通に時間を処理するnew Dateで指定して変換もできる
  • categories[]‥‥Atomの<category>、RSSの<category>
指定例、以下。
<div spry:region="Feeds" spry:repeatchildren="Feeds">
<a href="{link}">{title}</a>
</div>

これでSpryでRDFを表示できるので、便利。