Airで作るアプリケーション！PHPと通信してみる。

March 15th, 2008
Posted in Uncategorized
Write comment

ということで、Airで何かアプリケーションを作ってみようと言うことで、
取りあえず作ってみた。

といっても、せっかくなので外部と通信をしなくてはつまらない。
そんなわけで、まずは実験的な意味を含めて自作のPHPとAirで作った
プログラムを通信させようというのが今回の目標。

まずは、PHPの方については・・・。
まずは、簡単なサンプルを作成するということで、引数2個を受け取り、
その合計値を返すというプログラムを作ることにした。

もちろん、返却はXMLで行う。

と、ソースはこんな感じ。
特に難しいこともなく、ぐっちゃりとハードコーディング・・・。
1年ぶりのPHPでよくわからなかった。まぁいいか。

<?php

$arg1 = $_REQUEST['arg1'];
$arg2 = $_REQUEST['arg2'];

if(is_null($arg1) || is_null($arg2) || !is_numeric($arg1) || !is_numeric($arg2)) {
    $error = true;
} else {
    $error = false;
    $value = $arg1 + $arg2;
}
header("Content-Type: text/xml");
?>
<?xml version="1.0" encoding="UTF-8"?>
<Response>
<Header>
    <Args>
      <?php if(!is_null($arg1) && is_numeric($arg1)) { ?>
        <Arg name="arg1"><?php print($arg1); ?></Arg>
      <?php } ?>
      <?php if(!is_null($arg2) && is_numeric($arg2)) { ?>
        <Arg name="arg2"><?php print($arg2); ?></Arg>
      <?php } ?>
    </Args>
    <?php if(!$error) { ?>
      <Result><?php print($value); ?></Result>
    <?php } ?>
    <Status><?php if($error){ print("error"); } else { print("ok"); } ?></Status>
</Header>
</Response>

プログラムとしてはとっても簡単だ。
arg1とarg2をGETから受け取り、計算を行いあとは、XMLで返すという
だけの簡単なプログラム。

試しに、サーバーに設置を行い確認してみる。
http://hoge.com/api/plus.php?arg1=10&arg2=2

とこのような感じだ

次は、Airのほうだ。
まずはソースを・・・

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Button x="130" y="13" label="=" id="exeButton" width="34" click="plainRPC.send();" />
<mx:Text x="172" y="15" width="54" id="ansText"/>
<mx:TextInput x="10" y="13" width="45" id="arg1Text"/>
<mx:TextInput x="77" y="13" width="45" id="arg2Text"/>
<mx:Text x="59" y="17" text="+"/>
<mx:Script>
    <![CDATA[
    import mx.rpc.events.ResultEvent;
    import mx.rpc.events.FaultEvent;
    import mx.controls.Alert;

    public function handlePlain(event:ResultEvent):void
    {
      ansText.text = event.result.Header.Result;
    }

    public function handleFault(event:FaultEvent):void
    {
      Alert.show(event.fault.faultString, "Error");
    }
    ]]>
</mx:Script>

<mx:HTTPService result="handlePlain(event);" fault="handleFault(event);" id="plainRPC" resultFormat="e4x"
    url="http://labs.zsrv.net/api/plus.php"
    useProxy="false">
    <mx:request xmlns="">
      <arg1>{arg1Text.text}</arg1>
      <arg2>{arg2Text.text}</arg2>
    </mx:request>
</mx:HTTPService>
</mx:WindowedApplication>

とこのような感じとなった。
注意したい点をとりあえず抜粋してみる。

まずは、後半部分のHTTPリクエストを投げる部分について。

<mx:HTTPService result="handlePlain(event);" fault="handleFault(event);" id="plainRPC" resultFormat="e4x"
url="http://hoge.com/api/plus.php"
useProxy="false">
<mx:request xmlns="">
<arg1>{arg1Text.text}</arg1>
<arg2>{arg2Text.text}</arg2>
</mx:request>
</mx:HTTPService>

ここだ。
まずは、<mx:HTTPService>の要素についてだ。

result="handlePlain(event);"

これについては、リクエストを投げた後にレスポンスが返ってきた場合に
呼ばれる。つまりはコールバック関数だ。
ソースの上部分に、handlePlain(event)というメソッドが定義されているが、
このメソッドが呼び出される。

また、リクエストについては非同期で処理される。

fault="handleFault(event);"

については、リクエストを投げる処理が失敗したときに呼び出される。
これもまたコールバック関数だ。

id="plainRPC"

これは、このリクエストに対するIDだ。
実際にボタンイベントが発生したときにこのIDを使いHTTPリクエストを
起動している。

<mx:Button x="130" y="13" label="=" id="exeButton" width="34" click="plainRPC.send();" />

resultFormat="e4x"

これは、リクエスト結果をどのようなフォーマットで受け取るかの定義だ。
e4xというのに設定しておくと、返ってきた結果のXMLを「.」でつなぐことで、
値を取得出来るのでとっても楽だ。
（値の取得方法については後述）

urlやproxyについては解説なしで想像つくとおもうので省略。

<mx:request xmlns="">
<arg1>{arg1Text.text}</arg1>
<arg2>{arg2Text.text}</arg2>
</mx:request>

これについては、つまりはリクエストを投げる際の引数となる。
つまり、arg1Textとarg2Text(二つともテキストボックス）に設定された
値を引数とし、この引数をURLとくっつけリクエスト投げることになる。

少し上の方に戻る。次は、

public function handlePlain(event:ResultEvent):void
{
ansText.text = event.result.Header.Result;
}

についてだ。
ここが、リクエストの処理が返ってきたときに呼ばれるコールバック関数
の実態となる。
ここで、結果を受けている。

どのように取得しているかというと引数のeventから、

event.result.Header.Result;

という形で受け取っている。
ここで、わかりやすいように先ほど作ったPHPの結果のXMLを下記に書いておく。

<?xml version="1.0" encoding="UTF-8"?>
<Response>
<Header>
    <Args>
      <Arg name="arg1">10</Arg>
      <Arg name="arg2">5</Arg>
    </Args>
    <Result>15</Result>
    <Status>ok</Status>
</Header>
</Response>

となっている。
つまり、結果としては<Result>15</Result>を取得したいわけだ。
XPathで表記すると以下のようになると思う。

/Response/Header/Result

これを、Airでは、先ほど書いたとおり<Response>をのぞいた、

event.result.Header.Result;

で取得出来ることになる。「event.result」までがAirとしての構文。
「Header.Result」が、XMLの取得先となる。

以上で無事に、AirからPHPのアクセスを行い足し算結果を取得する
事が出来た。

Popularity: 7% [?]