18回からjQueryを利用したFeedの読み込みや，Twitterのタイムライン読み込みなどを行ってきましたが，今回は少し話を戻して「第18回　jQueryでAJAX入門：RSSをAJAXで取得してリストに表示する」の続きで外部RSSフィードをGoogle AJAX Feed APIを利用して読み込んでみましょう。jQueryとの絡め方も少し説明しています。

Google AJAX Feed API

18回でも少し紹介した通り，Google AJAX Feed APIを使えばクロスドメインの制約を超えて，外部RSSを読み込むことができます。利用するには，Google Maps APIと同じように，Googleアカウントが必要なので，取得していない方はまずGoogleアカウントを取得しておいてください。

APIキーの取得

キーの取得方法はおなじみGoogle Maps APIと同じで，利用したいドメインを入力してキーを取得します。

Google AJAX Feed APIのサインアップページ

APIの読み込み

APIキーを取得したら，読み込みましょう。

<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAttrn24k4yq5IZa1QwAH1phSX4GPXWjxz58tiRPyf1JSOBmEb7hSWuX3JPNgGyIoMLY00-8tj1ngDKQ"></script>

以上で，APIが使える状態になりました。実際にFeed APIを使うには，Feed APIをロードする必要があります。

Feed APIの読み込み

// Feed APIのロード
google.load('feeds', '1');

この後にすることのポイントは以下の2点です。

1. 取得したいRSSのURLでインスタンスを初期化
2. RSSの取得

取得したいRSSのURLでインスタンスを初期化

まずはRSSを読み込むために，インスタンスを初期化します。
new google.feeds.Feed(RSSのURL)で初期化します。

// Feedインスタンスの生成
var feed = new google.feeds.Feed('http://rss.rssad.jp/rss/gihyo/design/feed/rss2');

渡すRSSの種類はRSS1, RSS2, Atomとどれを渡してもGoogle AJAX Feed API側で処理して返されるため，渡すフィードの種類を気にしなくていい点も便利です。

対応しているフィード形式

公式ドキュメントによればGoogle AJAX Feed APIが対応しているフィード形式は以下の通りです。

• Atom 1.0
• Atom 0.3
• RSS 2.0
• RSS 1.0
• RSS 0.94
• RSS 0.93
• RSS 0.92
• RSS 0.91
• RSS 0.9

RSSの取得

インスタンスを初期化したら，Feedの読み込みを行います。
Feedの取得には.load()メソッドを利用します。

// Feedの取得 / load( callback ) callbackの引数resultでFeedを受け取る
feed.load(function(result) {
	// 実行したい処理
});

これで，load()メソッドのresult部分でRSSを受け取ることができます。ポイントは受け取ったFeedはJSON形式で返されるという点です。オプションを使うことで，XML形式で返すこともできますが，JSONのほうがアクセスしやすいので，今回はこのままJSONを利用します。

取得した情報へのアクセス

取得したデータは，実際にはJSONPで返されるので，Firebugのコンソールには表示されず，接続タブで確認することができます。

JSON形式ですので，それぞれはプロパティとしてアクセスすることができます。具体的には，エントリーは以下のように.feed.entriesでアクセスできます。

デフォルトの設定ではエントリーは4件読み込む設定になっています。後で説明しますが，この件数は変更することができます。

result.feed.entries

entriesは配列になっているので，for()や.each()でループさせて処理します。せっかくjQueryを使っているので.each()で例をあげてみます。

各entryのタイトルとURLはそれぞれ，.title, .linkでアクセスすることができます。

// entries の個数分処理を繰り返す
$(result.feed.entries).each(function() {
    console.log('href: ' + this.link + '\n' + 'text: ' + this.title);
});

アクセスできる要素

今回はtitleとlinkしか使いませんが，その他 entries のループ内でアクセスすることができる要素（プロパティ）は以下の通りです。