Geegle Feed API のサンプルをいくつか作ってみた

Google Feed APIによってクロスドメインの制限がなくなり、様々なフィードを取得し表示できるようになりましたが、そのメリットを今一つ活用し切れていないように感じられる。
他サイトのフィードを商用目的に利用する、または一つのコンテンツとすることについてはいろいろと制限があるかもしれないが、「JavaScriptだけでここまで出来るようになった」ということを明確(視覚的な意味で)に示したいということで、いろいろとサンプルを作ってみた。

『iTunes Store』のフィードを表示してみる

『Sample #1』ではページのソースを見てもらえば分かりますが、ほんの数行のJavaScriptだけで作られています。

取得しているフィード:
  1. Today’s トップ10ソングス
  2. Today’s トップ 10 アルバム
  3. Today's 10 最新リリース

『Sample #2』は見た目は 『Sample #1』に似ていますが、要素を一つ一つ取得して表示しています。カバー画像は小さめの画像にしたり、ジャンルや合計曲数は取得しなかったり と、名前空間URIが分かれば表示したいものだけをチョイスし、表示したい場所に出力することも可能です。

『Sample #3』ではTop100のアルバムのカバーだけを取得して表示しています。
アンカーの「title」に各エントリーのタイトルを取得して、カバー画像の上にマウスを置いたときに表示されるようにしています。
※Sample #3はIEだとページが崩れます。

『YouTube』のフィードを表示してみる

これも単純に取得表示したものです。

次は二つのフィードを比べてみた。

どちらも再生回数の多い動画 (本日分)のフィード(のはず)だが、内容が少々異なるのは良く分からないが、コンテンツ自体の違いがあるのが分かる。これを取得、表示し見比べると分かりやすい。

フィードの種類も同じRSS2.0ことから見ても、なぜに異なるフィードが存在するのか不思議。

おまけ

Google Feed APIには『google.feeds.FeedControl クラス』というものもあり、この『Feed Control』を使用しても複数のフィードを表示することが可能。

Google Search APIやjQueryと組み合わせたりすることでもっと面白いコンテンツになりそうな素材ではないかと。

0 Comments:

Sony Style(ソニースタイル)
デル株式会社

Recent Posts