CodeZine(コードジン)

特集ページ一覧

Zend StudioとFlex Builderを用いた
PHP + Flexでの統合開発

Flexとサーバサイド言語を緊密に連携

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2009/11/27 14:00

目次

Flex側のHello World!

 ここまでで「Hello world!」を出力するPHPが完成しました。次に、このテキストをリクエストし、結果を受け取り、表示するためのクライアントを作成する必要があります。メニューからFile/New/Project/Flex Builder/Flexプロジェクトを選択して、新規Flexプロジェクトを作成します。ダイアログボックスが表示されたら、PHPの部分を作成した時と同じように、プロジェクト名に「helloWorld」と入力し、Webルート直下にある「helloWorld」の名のプロジェクトディレクトリを指定します。アプリケーションの種類を「Webアプリケーション」、アプリケーションサーバの種類を「PHP」にそれぞれ設定します。デフォルトのWAMPインストレーションを実行するWindowsマシンの設定を図14に示します。デフォルトとは構成・設定が異なる場合は、Webサーバへの正しいファイルパスを入力します。

図14. 新規Flexプロジェクトの作成
図14. 新規Flexプロジェクトの作成

 「次へ」ボタンをクリックします。次に、Webサーバに関する情報を入力します。デフォルトのWAMPサーバインストレーションを実行するWindowsマシンの適切な設定を図15に示します。

図15. PHPサーバの設定
図15. PHPサーバの設定

 冒頭の2つのフィールドが入力できたら、「設定を検証」ボタンをクリックして動作を検証してみます。出力フォルダのフィールドに「bin-debug」と入力し、「次へ」ボタンをクリックします。

 新規Flexプロジェクトダイアログボックスでは、図16にあるように、出力フォルダURLが以前の手順で入力した「出力フォルダ」の値に相当する、Webルートより下の位置になっていることを確認します。

図16. プロジェクトのビルドパス、ソースフォルダおよび出力フォルダの入力
図16. プロジェクトのビルドパス、ソースフォルダおよび出力フォルダの入力

 「終了」ボタンをクリックします。新たなプロジェクトが生成され、IDE左上部のペイン内の一覧に表示されます。また、ウィンドウのメインペインには新たにhelloWorld.mxmlファイルが表示されます。表示がデザインビューになっている場合は、メインペイン上部左側の「ソース」ボタンをクリックします。<mx:Application>タグ内のlayout="absolute"の記述をlayout="vertical"に変更します。

 次に、<mx:Application>タグ直後の3行目に以下のコードを記述して、MXMLコードに<mx:HTTPService>タグを追加します。

<mx:HTTPService id="phpService"
     url="http://localhost/helloWorld/helloWorld.php"
     resultFormat="object" result="showResult()"/>

 上記のコードではHTTPServiceが作成されるとともに、そのいくつかのプロパティが定義されています。このサービスにはIDとしてphpService、ここで作成中のhelloWorld.phpファイルのURL、および結果の形式として汎用オブジェクトがそれぞれ定義されています。また、このサービスには結果の取得時にshowResult()関数を呼び出すことが定義されています。

 このサービスを実際に使用するには、sendメソッドを呼び出す必要があります。次のコードを利用して<mx:HTTPService>の直後に<mx:Button>コントロールを追加します。

<mx:Button label="Call PHP" click="phpService.send()"/>

 新しいボタンの「Call PHP」がクリックされると、HTTPServicesendメソッドが呼び出されます。

 次に、<mx:Script>ブロック内にshowResult()関数を作成する必要があります。<mx:HTTPService>タグの直後に以下のコードを記述します。

<mx:Script>
     <![CDATA[
     import mx.controls.Alert;
     privatefunction showResult():void {
     Alert.show(phpService.lastResult as String,'Message from PHP');
     }
     ]]>
</mx:Script>

 上記のActionScriptコードでは、アプリケーションでmx.controlsパッケージのAlertクラスが利用できるようにするために、まずImportステートメントが宣言されています。そして、showResult()関数が作成されています。この関数は、見出しが「Message from PHP」になった警告ポップアップを表示します。この警告ボックスには、helloWorld.phpファイルのHTTPServiceを呼び出した結果が表示されます。つまり、ここでは「Hello world! It's me, PHP!」と表示されることになります。編集中のファイルを保存してから緑色の「実行」アイコンをクリックし、アプリケーションの動作を検証してみます。「Call PHP」ボタンをクリックすると、図17に示す警告が表示されます。

図17. PHPの呼び出し結果を表示する警告ボックス
図17. PHPの呼び出し結果を表示する警告ボックス

 これでFlexとPHPの通信が可能になりました。では、アプリケーションをさらに作り込んでいくことにしましょう。


  • LINEで送る
  • このエントリーをはてなブックマークに追加

バックナンバー

連載:Adobe Developer Connection

もっと読む

著者プロフィール

  • Richard Bates(Richard Bates)

    Richard Batesは米国ジョージア州Athens在住のWebアプリケーションデベロッパー兼コンサルタントです。過去8年間、Richardは幅広くの業界に対してサービスを提供しており、顧客には電気通信事業者やヘルスケアプロバイダからホビイストおよび不動産業に至るまで、多岐にわたる業種の方々が含...

あなたにオススメ

All contents copyright © 2005-2022 Shoeisha Co., Ltd. All rights reserved. ver.1.5