友達の情報を取得
Facebookアプリのログインに成功したら、いよいよ友達の情報を取得します。友達の情報を持ってくるには、Facebookオブジェクト.getFriendsData(取得したい友人の数 , "randomかどうか" , ''取得したい情報”);のようにFacebookオブジェクトの getFriendsDataメソッドで取得します。
- 第1引数：取得したい友人の数で0を指定すると全員分のデータが来ます
- 第2引数：randomで取得するかどうかを指定
- 第3引数：取得したい情報を指定
第3引数の取得したい情報は、FacebookデベロッパーページのFQLユーザー情報一覧から選択することになります。その方法は、”取得したい情報1 , 取得したい情報2 , 取得したい情報3 , 取得したい情報4 , …”と、取得したい情報をカンマ区切りで指定します。
今回は性別と写真データを取得したいので、'sex , pic_square'の2つを指定しています。これで、全員分のデータを、性別と写真のURLをランダムの配列に格納するデータができあがります。
fc.getFriendsData( 0 , "random" , 'sex , pic_square');
データの取得が終わると、Facebookオブジェクトで"onGetFriendsData"イベントが発生します。ログインと同じ要領でリスナー登録をして、登録オブジェクトの onGetFriendsDataメソッドが実行されるようにします。fc.addEventListener("onGetFriendsData", this);がそのリスナー登録命令です。onGetFriendsDataメソッドの中身を見てみましょう。
this.onGetFriendsData = function()
{
fc.removeEventListener("onGetFriendsData", this);
if(fc.friendsDataArray.length <= 0)
{
alert("フレンド情報が見つかりませんでした");
}
else
{
//名前と写真の情報を取り出すメソッドを実行。
onStart();
}
};
ログインの時と同じように、使わないリスナー登録は、 removeEventListenerで解除します。友人のデータは、FacebookオブジェクトのfriendsDataArrayに格納されています。この配列が、空であれば友人の情報を取得できなかったことになります。この例では、友人情報が得られた場合、新たにonStartメソッドを実行しています。では、onStartメソッドを見てみましょう。
function onStart()
{
//情報を取得する。
console.log(fc.friendsDataArray);
}
console.logはGoogle ChromeのJavaScriptコンソールに内容を表示させるための命令であることは前に説明したとおりです。ここまでできたら、サーバーにアップして、Facebookデベロッパーページの「アプリ」で登録した、セキュリティで保護されたキャンバスのURLにアクセスしてみましょう。
このときにGoogle ChromeのJavaScriptコンソールを使うとデバッグが容易になります。Google Chrome 上の右上のレンチアイコンをクリックして「ツール」のJavaScriptコンソールを選んでみましょう。
JavaScriptコンソールが表示されるので、先ほどのアプリを実行してみましょう。
ログインに成功したら、「ログインに成功しました」というメッセージが表示されます。FacebookオブジェクトのfriendsDataArrayに友人の情報が配列で取得できていることが確認できます。
また、取得した配列には、友人のデータがObjectとして格納され、取得したい情報であるsexプロパティに性別のmaleまたはfemale、pic_squareプロパティに写真データのURLが格納されているのが確認できます。
各データは、以下のように呼び出せます。
- fc．friendsDataArray[0].pic_squareで0番目の友人の写真のURL
- fc．friendsDataArray[1].sexで1番目の友人の性別
”random”を指定して取得しているので、アクセスするたびにfriendsDataArrayに格納される友人の順番は変わります。このfriendsDataArrayを使えば、男女比率と、男女それぞれ最初の5人分の写真を表示できます。
