チュートリアルを見ながら、ちょっとしたアプリケーションを作成してみました。本当にちょっとしてます。
こんなビデオもあるよ
チュートリアルでは、Flex Builderでの例が載っているのでFlash CS3での例を示します。
まずは、。こちらにクラスパスを通して置いてください。
FLAファイルの作成
- facebook-actionscript-api http://facebook-actionscript-api.googlecode.com/svn/trunk/source/actionscript/ をダウンロードします
- flaファイルは[Flashファイル(AS3.0)]で作成します。
- flaファイルを保存します。
- flaファイルと同じディレクトリに[FacebookAPI.as]という空ファイルを作成します。
- flaファイルを開きます。
- [ファイル]->[パブリッシュ設定]->[Flash]タブ->[ActionScriptのバージョン]項目の右にある[設定]をクリック
- [クラスパス]へ先ほどダウンロードしたfacebook-actionscript-apiのパスを記入
- [ドキュメントクラス]へ[FacebookAPI]と記入
- [ドキュメントクラス]の右にある[えんぴつ]アイコンをクリック
- しばらくすると先ほど作成した[FacebookAPI.as]が開かれます。空ですね、もちろん。
とりあえず、FLASHオーサリングは放置。次は、facebookの設定を行います。
facebookの設定
- http://www.facebook.com/developers/へアクセスして、アプリケーションを使うことに同意する必要があります。
- 自分のアプリケーションを作成します。
- [設定を編集]->[詳細]->[詳細設定]のApplication Typeで[Desktop]を選択します(まずはオーサリングツールからパブリッシュして確認するので)。開発中は自分にしか見せたくない場合は[サンドボックスモード]を[可能にさせる]としておくと良いです。もちろんリリース時には[無力化]へ変更します。
- APIキーはマイアプリケーションのページでアプリケーションを選択すると表示されています。シークレットキーはAPIキーの下に表示されています。このシークレットキーですが、たまに秘密と訳されています(設定を編集内など)が、値は同様なので同じものを指していると思われます。
facebookの設定は以上でOK。次は、先ほど放置したFLASHオーサリングで開いている[FacebookAPI.as]に以下のソースをコピペして下さい(あまり素敵なコードではないかも知れません)。
package { import com.facebook.data.users.GetInfoData; import com.facebook.utils.FacebookSessionUtil; import com.facebook.data.users.FacebookUser; import com.facebook.data.users.GetInfoFieldValues; import com.facebook.commands.users.GetInfo; import com.facebook.net.FacebookCall; import com.facebook.events.FacebookEvent; import com.facebook.Facebook; import flash.display.Sprite; import flash.events.MouseEvent; import flash.text.TextField; import flash.text.TextFieldAutoSize; import flash.text.TextFieldType; /** * facebook api test * @author naoto koshikawa */ public class FacebookAPI extends Sprite { private const FACEBOOK_API_KEY:String = "あなたのアプリケーションのAPIキー"; private const FACEBOOK_SECRET_KEY:String = "あなたのアプリケーションのシークレットキー"; public var loginbutton:Sprite; public var title:TextField; private var fbook:Facebook; private var session:FacebookSessionUtil; private var user:FacebookUser; public function FacebookAPI() { // ボタンを作成します。雑ですみません。。。 var loginLabel:TextField = new TextField(); loginLabel.type = TextFieldType.DYNAMIC; loginLabel.width = loginLabel.height = 0; loginLabel.autoSize = TextFieldAutoSize.LEFT; loginLabel.text = "Click after you log into Facebook"; loginLabel.mouseEnabled = false; loginbutton = new Sprite(); loginbutton.addChild(loginLabel); loginbutton.addEventListener(MouseEvent.CLICK, onConfirmLogin); loginbutton.x = stage.stageWidth / 2 - loginbutton.width / 2; loginbutton.y = stage.stageHeight - loginbutton.height; loginbutton.graphics.lineStyle(1, 0x000000); loginbutton.graphics.drawRect(0, 0, loginbutton.width, loginbutton.height); // 結果などを表示するテキストフィールドを作成します。とても雑ですね。 title = new TextField(); title.type = TextFieldType.DYNAMIC; title.width = title.height = 0; title.autoSize = TextFieldAutoSize.LEFT; title.text = "Hello you"; title.y = stage.stageHeight / 2 - title.height / 2; addChild(title); addChild(loginbutton); init(); } private function init():void { session=new FacebookSessionUtil(FACEBOOK_API_KEY, FACEBOOK_SECRET_KEY, loaderInfo); session.addEventListener(FacebookEvent.CONNECT, onConnect); fbook=session.facebook; session.login(); } private function onConfirmLogin(event:MouseEvent):void { this.removeChild(loginbutton); session.validateLogin(); } private function onConnect(e:FacebookEvent):void { var call:FacebookCall=fbook.post(new GetInfo([fbook.uid],[GetInfoFieldValues.ALL_VALUES])); call.addEventListener(FacebookEvent.COMPLETE,onGetInfo); } private function onGetInfo(e:FacebookEvent):void { var infoData:GetInfoData = e.data as GetInfoData; trace(infoData.userCollection.getItemAt(0)); user=(e.data as GetInfoData).userCollection.getItemAt(0) as FacebookUser; title.text = "Hello "+user.first_name+" "+user.last_name + " " + user.name; } } }
[FacebookAPI.as]を保存したら、先ほど作成した.flaファイルをパブリッシュすればちょっとしたアプリケーションの完成です。