google.feeds.FeedControlクラス

広告

Google AJAX Feed APIでは単一のフィードではなく複数のフィードをまとめて取得することも可能です。ここではFeedControlクラスを使って複数のフィードを取得する方法について解説します。

1.google.feeds.FeedControlクラス
2.サンプル

google.feeds.FeedControlクラス

google.feeds.FeedControlクラスは複数のフィードを管理するための使われるクラスです。FeedControlクラスではコンストラクタが1つ用意されています。 

FeedControl()

まず次のようにFeedControlクラスのオブジェクトを作成して下さい。 

var feedControl = new google.feeds.FeedControl();

次にフィードコントロールで管理するフィードを追加していきます。FeedControlクラスで用意されているaddFeedメソッドを使います。 

addFeed(url, label)

1番目の引数にフィードのURL、2番目の引数にフィードに対するタイトルを文字列で指定します。

例えば次のように記述します。 

var control = new google.feeds.FeedControl();

control.addFeed("http://www.example.com/rss", "SampleSite");
control.addFeed("http://www.example.jp/rss", サンプルブログ");

フィードコントロールに追加された全てのフィードを取得するにはFeedControlクラスで用意されているdrawメソッドを使います。 

draw(element, opt_options?)

drawメソッドを実行するとフィードの取得を行うと同時に決められた形式でフィードを出力します。1番目の引数には取得した結果が出力されるDOMノードを指定して下さい。2番目の引数には表示形式を指定するオプションです。こちらは次のページで確認します。

例えば次のように記述します。 

google.load("feeds", "1");

function initialize() {
  var control = new google.feeds.FeedControl();

  control.addFeed("http://www.example.com/rss", "SampleSite");
  control.addFeed("http://www.example.jp/rss", サンプルブログ");

  control.draw(document.getElementById("feed"));
}

google.setOnLoadCallback(initialize);

IDが"feed"のDOMノードに対して取得したフィードの内容が書き出されます。

サンプル

それでは簡単なサンプルで試してみます。 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Google AJAX Feed API テスト</title>

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="./js/script1_1.js"></script>

</head>
<body>

<p>Google AJAX Feed API テスト</p>
<div id="feed"></div>

</body>
</html>

google.load("feeds", "1");

function initialize() {
  var control = new google.feeds.FeedControl();
  var feedurl1 = "http://googlejapan.blogspot.com/atom.xml";
  var feedurl2 = "http://googleblog.blogspot.jp/atom.xml";

  control.addFeed(feedurl1, "Google Japan");
  control.addFeed(feedurl2, "Official Google Blog");

  control.draw(document.getElementById("feed"));
}

google.setOnLoadCallback(initialize);

上記を実際にブラウザ見てみると次のように表示されます。

p1-1

このようにフィードコントロールを使うことで複数のフィードをまとめて取得し出力することが可能です。

( Written by Tatsuo Ikura )