結構楽にAMFする方法

as3

GW明けてそろそろブログ再開しまーす


今日は名古屋 WCAN mini ASでの

AMFPHP+S2Flex2Componentsの話を載せるのを

忘れてましたので、それを書いておきます。


では、結構楽にAMFする方法です。

4/21名古屋と4/28大阪でお話させて頂いた内容の一部です。


わたしの思う一番簡単にAMF通信する方法(正確には「一番簡単にAMF通信する環境を作る方法」)は、
まちがいなくDoltengだと思うのですが、

javaを使用しない場合では、


・サーバーサイドにAMFPHP
・AS3のAMF通信コンポーネントにs2flex2-components


の組み合わせがなかなか楽で良いと思います。

で、やってみます。


■環境を用意する

1) AMFPHPをインストール

http://www.amfphp.org/からダウンロード

ダウンロードしたファイルを解凍して、プロジェクトルート/html-template/に入れる。

http://localhost/yourproject/bin/amfphp/にアクセスしてIndex of /amfphpのページが見れたらOK。

2) s2flex2-components.swcをビルドパスに含める

http://s2flex2.sandbox.seasar.org/ja/からS2Flex2 components 1.0.0をダウンロード

解凍後、target/swc/にあるs2flex2-components.swcを取り出す

取り出したswcファイルをEclipseのFlexプロジェクトにドロップ

プロパティでswcをビルドパスに含める

環境はこれで完成。

で、
■ログインサンプル(笑)作ってみます。

1) mxmlを記述

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
  xmlns:s2="http://www.seasar.org/s2flex2/mxml" xmlns="*"
  fontSize="14">

  <mx:Script source="script.as" />
    <s2:S2Flex2Service id="amf" destination="LoginService"
    gatewayUrl="http://localhost/amfphp-sample/bin/amfphp/gateway.php"
    result="onResult(event)" fault="onFault(event)" showBusyCursor="true" />
    <mx:ViewStack id="viewstack1" width="100%" height="100%" creationPolicy="all">
    <mx:Canvas id="vs1" label="ビュー 1" width="100%" height="100%">
    <!-- ログイン -->
    <mx:Panel x="356.5" y="125" width="250" height="200" layout="absolute" title="Login form">
    <mx:Form x="10" y="10" width="210" height="110">
    <mx:FormItem label="ID"><mx:TextInput width="89" id="userid"/></mx:FormItem>
    <mx:FormItem label="Pass"><mx:TextInput width="88" id="password" displayAsPassword="true"/></mx:FormItem>
    </mx:Form>
    <mx:Button x="87" y="128" click="onClickButton();" label="login"/>
  </mx:Panel>
  </mx:Canvas>
  <mx:Canvas id="vs2" label="vs2" width="100%" height="100%">
    <mx:Label id="message" x="422" y="218" text="ラベル" fontSize="30"/>
    <mx:Image x="455" y="268" source="hinata.jpg"/>
  </mx:Canvas>
 </mx:ViewStack>
</mx:Application>

S2Flex2Serviceタグがサーバーへ通信するクラスです。gatewayUrlは、yourdomain/amfphp/gateway.phpを指定します。

2) asを記述
MXML内に書いても外部ファイルに書いてもどちらでも良いです。

// ActionScript file
import flash.events.Event;
import mx.controls.Alert;
import vo.Account;

// サーバーからの応答時のイベントを受ける
public function onResult(event :Object) :void{
    if( event.result.userName != "NG"){
        this.viewstack1.selectedChild = this.vs2;
        this.message.text = event.result.userName + "さん。こんにちわ。";
    }else{
        Alert.show("ログインできません");
    }
}

public function onFault(event :Object) :void{
    Alert.show(event.toString());
}

// ボタンをクリックしたときの処理
public function onClickButton() :void{
    var param1 :String = this.userid.text;
    var param2 :String = this.password.text;
    // サーバーサイドのメソッドを実行
    this.amf.login(param1,param2);
}

3) サービスクラス(PHP)を記述

<?php
require_once("vo/Account.php");
class LoginService{
    var $methodTable;
    function LoginService(){
        $this->methodTable = array(
        "login" => array(
        "description" => "function login",
        "access" => "remote",
        "arguments" => array("userName","password")
        ));
    }

    // ログインメソッド
    function login($userId, $password){
        $account = new Account();
        $account->userId = $userId;
        $account->password = $password;

        if($userId == "hirossy" && $password == "pa"){
            $account->userName = "やまもと";
        }else{
            $account->userName = "NG";
        }
        return $account;
    }
}
?>


4) 動かす

PHP,ASともにValueObjectは省略だす。
結構お手軽です。








溜まったタスク：

・Red5

・ExternalInterface

・LCDS2.5への復讐(S2Factory for FDSを動かす)

明日からみっちりやりますよ〜（たぶん）