Facebookアプリ開発チュートリアル第1回 -自分の情報を取得する

on 2011年3月21日

Facebookアプリケーション開発 > JavaScriptによる開発チュートリアル第1回

Facebookが提供するJava Script SDKを利用すれば簡単にFacebookデータを取得できます。
ここでは、JavaScriptによるFacebookアプリケーション開発チュートリアルを提供しています。
第1回はFacebook JavaScript SDKを利用して自分の情報を取得方法です。
（参考：Facebook JavaScript SDK)

1. JavaScript SDKを読み込みます。
以下のコードをBody内に記述ください。赤字の値をあなたのアプリケーションIDに変更ください。

<div id="fb-root"></div>
<script src="http://connect.facebook.net/ja_JP/all.js"></script>
<script>
  FB.init({
    appId  : 'YOUR APP ID',
    status : true, // check login status
    cookie : true, // enable cookies to allow the server to access the session
    xfbml  : true  // parse XFBML
  });
</script>

2. ログインしているかを確認します。
response.sessionがTrueであればログインしているので、ユーザー情報取得関数を呼び出します。

FB.getLoginStatus(function(response) {


if (response.session) {


document.getElementById('login').innerHTML


='<a href="#" onclick="FB.logout();">Logout</a><br/>';


get_user_information();


} else {


document.getElementById('login').innerHTML


='<fb:login-button show-faces="true" width="200"'


+ ' max-rows="1" perms="user_likes, friends_likes">'


+ '</fb:login-button>';


FB.XFBML.parse();


}


});

3. Facebookに登録された自分の情報を表示します。
FB.apiでAPIを呼び出します。（参考：Facebook Developers FB.api）。FB.apiを使って、ほぼ全ての機能を利用できます。ただし、実際に利用できるかどうかはユーザーから許可を得る必要のあるケースが多々あります。


function get_me_information() {

document.getElementById('information_me').innerHTML = "Requesting data from Facebook ... ";

FB.api('/me', function(response) {

document.getElementById('information_me').innerHTML = response.name;

});

}

4. 友達の名前を取得します。
さらに、Facebook上の友達の名前を取得します。以下のコードは友達の数だけループして名前を表示しています。


function get_friends_information() {
    document.getElementById('information_friends').innerHTML = "Requesting data from Facebook ... ";
    FB.api('/me/friends', function(response) {

        for ( i=0; i < response.data.length; i++){
        document.getElementById('information_friends').innerHTML += response.data[i].name+"";
        }
      });
}

さあ、次はFacebookページ情報を取得しましょう。
第2回Facebookページ情報を取得する



関連記事

関連記事





Tagged with:
 
お友達にも教えてくださいね!
Facebook Twitter

Comments are closed.