そろそろFlashからFacebookできるようになっておこうぜ vol.3 認証編 [ #facebookjp ]

ando

Dec 20, 2010

facebook

前回から間があいてしまってごめんなさい。今回はいよいよFacebookのOAuth認証をしてみます。

前々回の記事：そろそろFlashからFacebookできるようになっておこうぜ vol.1 設定編

前回の記事：そろそろFlashからFacebookできるようになっておこうぜ vol.2 AS&JS編

前回までのサンプル：こちらからダウンロードできます。

OAuth認証を実行！

初期化処理のコールバック関数 initCallBack に続きを書いていきましょう。

前回、成功 / 失敗と分岐していましたが、どちらの場合でも認証を実行します。

private function initCallBack(response:Object, fail:Object = null):void
{
	tf.appendText('initCallBack\n');
	if (response)
	{
		//初期化成功。
		tf.appendText('Facebook　初期化に成功.\n');
		tf.appendText('あなたのユーザID：' + response.uid + '\n');
	}
	else
	{
		//初期化失敗
		tf.appendText('Facebook　初期化に失敗.\n');
	}
	
	tf.appendText('Facebook.login();　認証を開始します...\n');
	//セッション状態が変わった時に呼ばれる関数を設定しておきます。
	ExternalInterface.addCallback('sessionChange', onSessionChangeHandler);
	//アプリが実行する操作範囲　（参照：Extended Permissions - http://developers.facebook.com/docs/authentication/permissions
	var permissions:Array = ['publish_stream'];
	//認証を実行します。第1引数にはコールバック関数、第2引数にパーミッションを渡します;
	Facebook.login(loginCallBack, {perms:permissions.join(',')});

}

OAuth認証が成功するとセッションの状態が変わります。まずそれを受け取るためのコールバック関数を設定しておきます。

次に、 Facebook.login(); を実行してOAuth認証を開始します。この関数の第1引数にはコールバック関数（セッション状態変更を受け取る関数とは別なもの）を、第2引数には「このFlashが実行する権限」を渡します。

権限について詳しくはこちらを参照してください。：http://developers.facebook.com/docs/authentication/permissions

2つのコールバック関数はそれぞれ以下のように書いておきます。

private function loginCallBack(response:Object, fail:Object):void
{
	if (response)
	{
		tf.appendText('ログイン・認証に成功.\n');
		tf.appendText('あなたのユーザID：' + response.uid + '\n');
	}
	else
	{
		tf.appendText('ログイン・認証に失敗.\n');
	}
}

private function onSessionChangeHandler(session:String, extendedPermissions:Object = null):void
{
	//セッション状態に変更あり。
	tf.appendText('セッション状態に変更あり.\n');
	if (session)
	{
		//JSONなのでデコードします。
		var response:Object = JSON.decode(session);

		tf.appendText('あなたのユーザID：' + response.uid + '\n');
		//ここでアクセストークンを取得することができます
		tf.appendText('アクセストークン：' + response.access_token + '\n');

		this._myID = response.uid;
		this._accessToken = response.access_token;

		//自分のIDとアクセストークンを取得しました。これでAPI使用の準備が出来ました。
	}
	else
	{
	}
}

OAuth認証によりセッション状態が変更されると、自分のユーザIDとアクセストークンを受け取ることができます。このアクセストークンはAPIを叩くための鍵のような役割をはたします。

それでは、ここまでの状態で一旦パブリッシュしサーバへアップして確認してみましょう。認証を開始すると例の画面がポップアップで開きます。うまくいかない場合はFacebookアプリケーション設定のURLやドメインの設定が合っているか？Flashが置いてあるURLは合っているか？などを確認してください。

ｷﾀ━(ﾟ∀ﾟ)━!

アクセストークンを使ってAPIを叩く！

OAuth認証が通ったら、早速APIを利用してみます。

各種APIを叩くには Facebook.api(); というメソッドを使います。

//Facebook.api('リクエストするAPI', コールバック関数, {access_token:アクセストークン文字列});
Facebook.api('/me/friends', loadFriendsHandler, {access_token:this._accessToken});

成功すればコールバック関数で友達一覧を受け取れます。

private function loadFriendsHandler(response:Object, fail:Object):void
{
	if (response)
	{
		tf.appendText('友達一覧取得成功\n');
		var friends:Array = response as Array;
		for (var i:int = 0; i < friends.length; i ++)
		{
			tf.appendText(friends[i].name + 'さん　ユーザid：' + friends[i].id + '\n');
		}
	}
	else
	{
	}
}