公開API活用ガイド 発売中！

公開APIを利用したサンプルサイトを作っていくよ

APIサンプル集一覧

開発ツール・リファレンス

管理人ブログ

ドラクエ6攻略Wiki
ドラクエ7（3DS版）攻略Wiki
ドラクエ9攻略Wiki
DQMJ2攻略Wiki
テリーのワンダーランド攻略Wiki
ポケモン ブラック攻略Wiki
アルトネリコ攻略Wiki
レイトン教授攻略Wiki
おはようチューブ
iPhoneアプリランキング
iPadアプリランキング

Google AJAX Feed API

Google AJAX Feed APIとは

Google AJAX Feed API
AJAX Feed API を使用すると、JavaScript だけを使用して、公開されている Atom フィードや RSS フィードをダウンロードできるので、自分のコンテンツや Google Maps API などの他の API に、フィードを簡単にマッシュアップできます。

Google AJAX Feed API を使えば、複雑なサーバー側のプロキシの処理などは不要で、たった数行の JavaScript を使用してフィードをマッシュアップできるため、JavaScript でのマッシュアップ開発に苦労することはありません。フィードをウェブサイトに統合する作業も簡単、迅速です。

サンプルサイト

Google AJAX Feed API サンプル

サンプルソースコード

s_gafa.php（文字コードはUTF-8） 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google AJAX Feed API サンプル</title>
    <script type="text/javascript" src="http://www.google.com/jsapi?key=取得したキーを設定する"></script>
    <script type="text/javascript">

//APIを読み込む
google.load("feeds", "1");

//初期関数
function initialize(){
  
  //読み込むフィードを設定する
  var feed = new google.feeds.Feed("http://feedproxy.google.com/hatena/b/hotentry");
  
  //読み込む件数を設定する
  feed.setNumEntries(10);
  
  //フィードを読み込む
  feed.load(function(result){
    
    //エラーチェック
    if(!result.error){
      
      //表示するエレメントを設定する
      var container = document.getElementById("feed");
      
      //一時的に保持する文字列変数を初期化する
      var temp = '';
      
      //フィードのエントリ数だけループ処理する
      for(var i = 0; i < result.feed.entries.length; i++){
        
        //フィードのエントリを変数entryに読み込む
        var entry = result.feed.entries[i];
        
        //フィードエントリのlink,entry,content情報を設定する
//        temp += '<dt><a href="' + entry.link + '">' + entry.title + '</a></dt>';
//        temp += '<dd><a href="' + entry.link + '"><img src="http://capture.heartrails.com/medium?' + entry.link + '"></a></dd>';
        temp += '<dt>'+entry.content+'</dt>';
      }
    //DLタグで囲み、出力する
    container.innerHTML = '<dl>' + temp + '</dl>';
    }
  });
}
//コールバック関数に登録
google.setOnLoadCallback(initialize);

    </script>
  </head>
  <body>
  <h1>Google AJAX Feed API サンプル</h1>
  <div id="feed"></div>
  <p>powerd by <a href="http://code.google.com/intl/ja/apis/ajaxfeeds/">Google AJAX Feed API</a></p>
  </body>
</html>

利用上の注意

APIを利用する際は、提供元APIの利用規約を必ず確認してください。
また、このサイトのサンプルソースコードの利用や解説などについては、「利用上の注意」のページをご覧ください。

ソースコードの解説は、「早速Google AJAX Feed APIを導入してみました」および近日発売の書籍にて掲載予定です。
2009年03月13日 サンプル集