PHPおよびFlex、リッチインターネットアプリケーションの「新しい」代替
Webアプリケーション開発の分野における近年の主な傾向は、ユーザーインターフェイスの質的な向上と複雑化です。 ユーザーを引き付けるには、より便利で高速で高品質のインターフェースを作成する必要があります。 現在の技術は改善され、新しい技術が登場します。 RIAを構築するニッチ分野の著名な代表者の1人は、Adobe Flex製品ファミリです。 この資料は、この新しいテクノロジーのレビューであり、Flexに組み込まれている原則とアイデア、およびPHPとの関係を一般的に理解することを目的としています。 また、さらなる研究を促進するために、検討中のトピックのより詳細な説明へのリンクを使用して、この記事をできるだけ飽和させようとしました。
フレックスとは
Adobe Flex 2は、Flash関連テクノロジーに基づいてRIAを開発できるソリューションです。 インターフェイスの説明は、XMLダイアレクトであるMXMLに基づいているだけではありません。 ActionScript3(以降AS3)のクライアントロジックの説明。 コンパイルの結果、MXMLは通常のASコードに変換され、mxmlcコンパイラに渡されてswfファイルが取得されます。
Flexはいくつかの製品で構成されています。
Adobe Flex Builderは、EclipseベースのIDEです。 AS3およびMXMLを迅速に開発できます。 視覚的なインターフェース設計のための強力なツールがあります。 構文とツールチップ、ビルトインDebbuger、ヘルプなど。
Adobe FlexフレームワークとSDK-コンポーネントベースのフレームワーク。 複雑なインターフェースを開発できる膨大な数の拡張可能なコンポーネントが含まれています。 無料です。 Flex Builderが付属
Adobe Flex Chartingは、あらゆる種類のインタラクティブなチャートやグラフを作成できるライブラリです。 有料
Adobe Flex Data Servicesは、FlexアプリケーションとJAVAアプリケーション間の高速で便利なデータ交換を担当するサーバーコンポーネントのセットです。
これらすべての基盤となるのがFlash Playerです(Flexアプリケーションを使用するには、9番目のバージョンが必要です)。 プレーヤーの主な利点は、その操作がプラットフォームまたはブラウザーに依存しないことです! 驚くほど小さいサイズ(1.1M)のコンパートメントへの設置の容易さは、その普及に貢献しています。
Flexアプリケーション開発
上記のように、インターフェースの設計は、MXMLタグでそれらを記述することにより実行されます。 例えば
<WebService id="ws" wsdl="some.wsdl"> <Button label="Get Data" click="ws.getData()"> <DataGrid dataProvider=”{ws.getData.result}”> <LineChart dataProvider=”{ws.getData.result}”>
<WebService id="ws" wsdl="some.wsdl"> <Button label="Get Data" click="ws.getData()"> <DataGrid dataProvider=”{ws.getData.result}”> <LineChart dataProvider=”{ws.getData.result}”>
MXMLは、データを宣言的にバインドし、イベントハンドラー、エフェクトを定義し、リモートデータソースと通信し、データ構造を記述するためにも使用されます。
インターフェイスコンポーネントは2つのタイプに分けられます。
•コントロール、ナビゲーター-インターフェース要素。 Button、DataGrid、Tree、ProgressBarなど...
•コンテナ-さまざまなコントロールを含み、画面上の位置を決定する領域。 Hbox、Vbox、パネル、グリッドなど...
図 1は、Flexアプリケーションの構造を示しています。
視覚的なコンポーネントに加えて、インターフェイスを構築するためのその他の補助コンポーネントがあります。
•バリデーターとフォーマッター-テキストをチェックしてフォーマットします。 RegExpvalidator、CreditCardvalidator、DateFormatterなど...
•エフェクト-一定期間(ミリ秒単位)に発生する要素の視覚的または音声アニメーション。 など、すべての種類の外観、動き、回転、増加、音...エフェクトのセットは本当に印象的です!
•状態の表示-インターフェイスの状態。 各状態は、異なるコンポーネントのセットによって特徴付けられます。 状態を切り替え、さまざまな切り替え効果を設定できます。
例を含むすべてのインターフェイスコンポーネントの完全なリストは、 http://examples.adobe.com/flex2/inproduct/sdk/explorer/explorer.htmlにあります。
インターフェイスの構築は、MXMLタグを使用するだけでなく、ASコードを使用して記述することもできることに注意してください。 実際、Flexの場合、これらは完全に同等のメソッドであり、すべてタスクと設定に依存します。 これは、各MXMLタグがクラスまたはそのプロパティに対応しているためです。 つまり あなたが書くとき:
<mx:ボタンラベル=” Test” />
Buttonクラスのインスタンスを作成し、そのラベルプロパティを初期化します。
MXMLの重要な機能はその拡張性です。 独自のタグを作成し(コンポーネントを読みます)、標準のタグと同様にそれらを使用し、それらに基づいて視覚的にインターフェースを設計できます。
例:
<andry:CustomButton label =” Click Me” />
そして
package{
import mx.controls.Button;
public class CustomButton extends Button{
public function CustomButton(){
super();
}
}
}
HTMLのCSSと同様に、Flexアプリケーションの開発時にスタイルを定義することもできます。 各ビジュアルコンポーネントには独自のスタイルパラメータのセットがあり、表示の多くの側面を変更できます。 スタイルは実行時に変更できます。 スタイルを定義するために、アドビはFlex Style Explorerを開発しました。Flexスタイルエクスプローラーでは、各パラメーターが表示にどのように影響するかを視覚的に観察して、独自のスタイルを作成できます。 代替手段があります。 高度なスキニングについては、 この記事を読むことをお勧めします。 デザイナーとプログラマーの分業については、 こちらをご覧ください 。
MXMLにはアプリケーションの多くの側面があり、その一部を簡単に確認しました。 ただし、Flexアプリケーションのロジックを記述するためにActionScriptを使用する必要があります。
ActionScriptは、 ECMAScript Draft 4(ECMA-262)に基づくオブジェクト指向プログラミング言語です。 言語の主な機能:
•継承
•インターフェイス
•モジュール性
•アクセス指定子
•変数、プロパティ、およびパラメーターの入力(コンパイル時)
•静的メンバー
•型キャスト
•リフレクションAPI
•動的クラス(実行時のメソッドとプロパティの追加)
•ECMAScript for XML(E4X)。 ECMA-357標準に基づいています。 標準のXML解析とは異なり、E4XはXMLを特定の言語のデータ型にネイティブに変換し、XMLでの作業を大幅に促進します。
•DOM3イベントモデル
そして、はるかに 。 もちろん、AS3のすべての能力は、イベント、コレクションの高度な管理など、非常に豊富な機能を備えたフレームワークによって決定されます。膨大な数のコンポーネントには、Flexフレームワーククラスの印象的な階層が含まれます。
<mx:Script>タグを使用してコードのブロックを追加するか、外部ActionScriptファイルを含めることにより、FlexアプリケーションでActionScriptを使用できます。 MXMLアプリケーションで使用するために、外部クラスファイルまたはパッケージ全体をインポートすることもできます。 FlexはActionScriptを抽出し、最終的なSWFファイルにリンクされるクラスファイルを作成します。 ActionScriptで作成されたコンポーネントには、グラフィック要素を含めたり、独自のビジネスロジックを定義したり、既存のFlexコンポーネントを拡張したりできます。 Flexで使用可能なコンポーネントから継承できます。
Flexアプリケーション開発のその他の側面
特定の製品に基づいてアプリケーションの開発を決定する場合、言語の機能だけでなく、採用されたソフトウェア開発プロセスに寄与するソフトウェア製品の量、そして最も重要な品質も評価する必要があります。
もちろん、すべてのソフトウェアを文書化する必要があります。 コードを文書化するための特定の「標準」は、JavaDocスタイルのコメントです。 アドビの開発者はこのスタイルから逸脱せず、 ASDocを作成しました。 残念ながら、そのサポートをビルダーに統合するのを忘れています。
当然、ソフトウェアはテストする必要があり、できれば手作業だけではありません。 Flexアプリケーションをテストするための3つのプロジェクトがあります。
•機能的な受け入れテストのためのMercury QuickTest Professional 。
•単体テスト用のFlexUnit 。 残念ながら、それはまだ十分に生のままです。
• ストレステスト用のFlexストレステストフレームワーク 。
ソフトウェア開発の良いスタイルは、デザインパターンの使用です。 これにより、システムのアーキテクチャが改善され、他の開発者がそれをより速く理解できるようになります。 Flexの世界では、デザインパターンの軽量コレクションであるCairngormアーキテクチャフレームワークがこの分野で人気を集めています。 このフレームワークの品質と人気により、新しいバージョンのFlexフレームワークに含まれるようになりました。
ActionScriptとJavaScriptの間のやり取りには、 Flex-Ajax Bridgeを使用できます。これにより、JSからASを操作したり、JSからASを操作したりできます。 また、このライブラリは、JSからASへのスムーズな移行に役立ちます。
新しいAdobe製品であるApollo (現在のAIR)について簡単に触れます。 その主なタスクは、Web開発者が本格的なデスクトップアプリケーションを作成できるようにすることです。 開発者によると、アプリケーションはFlex、HTMLおよびJavaScript、PDFで記述できます。 最近、最初のアルファ版がリリースされ、ファイルシステムを操作する機能がすでに利用可能になりました。 おそらく、Windows APIとデータベースのサポートがあるでしょう。 最初のリリースは年末に予定されています。
もちろん、有用なソフトウェア製品のリストはこれに限定されません。 毎日の開発で他の製品を使用する場合は、対応する製品を自分で見つけてください 。
HTMLとJavaScript vs MXMLとActionScript
このセクションのカテゴリタイトルにもかかわらず、著者は、Webアプリケーションの開発に対するこれらのアプローチを相互に排他的であり、その逆も考えていません。
すべて同じように、比較することから始めましょう:
HTMLとJavaScript | MXMLおよびActionScript | |
クロスブラウジング | JavaScriptの嫌な惨劇! この機能を提供するには十分な努力が必要です。 HTMLでは、物事も最高ではありません。 すべてのブラウザで完全に同一の作業。
開発者基準があります。 ブラウザ開発者がいます。 彼らは異なる世界に住んでいるという感覚があります。 Adobe Systemによってサポートされ、積極的に開発されています。 言語の機能性私は先史時代のレベルでこの言葉を恐れていません。 新しい機能を言語に導入するダイナミクスは、単に恐ろしいものです。 フレームワークのみが何らかの形で保存されますが。 HTMLに関しては、当然、優れた組み込み機能があります。 | JavaScriptの数桁先を行っています。 ところで、AdobeとMozillaは、JSをECMAScript標準(ECMA-262)に導入することを計画しています。これは、ASに既に実装されています。 言語の能力は、そのフレームワークによっても決まります。その機能は、JSフレームワークのいずれよりも優れています。
アプリケーションサイズ比較的小さい十分に大きい。 Flexアプリケーションにフレームワーク機能を含める必要性と関連しています。 それが、Flash Playerが非常に小さい(1.1M)理由です。 |
有病率 | どこでも。 膨大な数のさまざまな素材、ソフトウェア、専門家 | 勢いを増している(急速なペースで注目すべきである)。 比較的少数の専門家。 |
検索エンジンのインデックス作成 | 特定のAjaxアプリケーションに加えて。 それはすべて開発者に依存します。 | 静的テキストとリンクのみがインデックス付けされます。 弱いインデックスは通常、Flexアプリケーションの俊敏性が高いためです。 インデックス作成を改善するには、この記事を読むことをお勧めします。 Googleとの最近のインタビューから、彼らは(おそらくAdobeと一緒に)近い将来インデックス作成を改善することを計画していることが明らかになりました。 (すでにそこに!) |
RIAの開発速度 | 低い これは、JSアプリケーションの完全な開発およびデバッグ環境の欠如、およびソリューション自体の複雑さによるものです。 | 十分に高い。 開発環境は完璧とはほど遠いという事実にもかかわらず、それにより、多くのことを簡単かつ迅速に行うことができます。 また、ビジュアルデザイン環境は、デザイナーやレイアウトデザイナーの特別なスキルがなくても、非常に優れたインターフェイスをすばやく作成するのに役立ちます。 |
Flexアプリケーションには、HTMLおよびJavaScriptバンドルを完全に置き換えることができない2つの主な欠点(swfファイルの普及率とサイズ)があります。 必要ですか? 私はそうは思いませんし、これらの欠点の問題だけではありません。 HTMLとJavaScriptは、Web開発の標準として長い間定着しています。 膨大な数のサイト、ソフトウェア、統合が書かれています...そして最も重要なことは、この場合、World Wide Webのイデオロギーは失われます-それはリンクされたページのセットです。 これは、十分な程度の対話性とダイナミクスが必要な一連のアプリケーションとは異なります。 国境はどこですか? あなた次第だと思います。
現時点では、Flexアプリケーションには3つのアプリケーション領域があるように思えます
•企業アプリケーション。 明らかな利点を備えたWebインターフェイスは、エンタープライズ市場で人気が高まっています。 フレックスはこの分野に最適です。 インタラクティブでダイナミックな美しいWebアプリケーションをすばやく簡単に作成できます。 そして、インタラクティブなベクターグラフィックスの美しさと機能性は誰もが驚くはずです 。
•通常のユーザーアプリケーションのWebインターフェイス。 アドビは、Photoshopのオンラインバージョンをリリースする予定です。 すでにオンラインバージョンのオフィスがあります... Apolloのリリースにより、このようなアプリケーションの開発はさらに簡単になります。
•サイト、ポータル...もちろん、サイト全体をFlexで作成する必要は必ずしもありません。 どの機能がRIAに該当するかを考え、それをFlexアプリケーションとして個別に実装すると、フラッシュ以外の部分といつでも簡単にやり取りできます。
100回聞くよりも1回見る方が良い
最近見た中で最も印象的なコンポーネントはFlexBookです。 アイデアは、あなたが普通の本になる前に、マウスを使ってランダムな順序でリーフスルーできるということです。 各ページには任意のFlexコンポーネントを含めることができます(図2では、テキストと背景のある画像のみがあります)。ApolloとHTMLの場合は。 これは本当にWebページです。
Google Finance 大規模システムでの対話型グラフィックスの使用の良い例。
Yahoo Maps。 高負荷サイトでFlexアプリケーションを使用する良い例。
Picnik このサイトを見て、Adobeはphotoshopのオンラインバージョンを作成することにしたと思います。 システムはまだベータ版であるという事実にもかかわらず、画像を処理および編集するための非常に印象的な機能を備えています。
PHPおよびFlexバンドルフレームワーク
概要
検討中のフレームワークの主な役割は、Flex上のアプリケーションとサーバー側の間のデータ交換です。
実際、PHPからデータを取得する方法はいくつかあります。
•データをAMF形式にシリアル化するフレームワークを使用します。 RemoteObjectコンポーネント
•SOAPリクエスト。 WebServiceコンポーネント
•GETおよびPOST要求を使用します。 HTTPServiceコンポーネント
•ソケット(バイナリを含む)
RTMP / RTMPS(マルチメディア伝送用)、HTTP、HTTPS、TCPなどのさまざまなプロトコルをサポートしています。また、バイナリソケットを使用して、さまざまな種類のプロトコルと対話できるコードを記述できます。
さまざまな形式のデータを交換することもできますが、最も一般的なものは次のとおりです。
•AMF(アクションメッセージ形式)。 バイナリ形式
•XML
•JSON
AMF形式について詳しく説明します。 この形式は、Flashアプリケーションとサーバー間の効果的な対話のためにFlash Playerによって使用されます。 その中で、コンパクトな形式で、RPC(リモートプロシージャコール)とデータがエンコードされ、XMLを送信するよりもはるかに効率的です。 AMF0およびAMF3形式の2つのバージョンがあります。 最初はAS1とAS2で使用されます。 2番目はAS3によってのみサポートされており、AMF0よりも効率的です。
フレームワークの比較
AMFPHP、WEBORB、SabreAMFの3つの主要なフレームワークを検討します(現在はZendAMFがすでにあります)。 それらはすべてRPCを使用できます。 すべてのフレームワークは無料です。
一般的に、主なことは同じ方法で行われることに注意してください。 すべてのフレームワークに共通する点を強調します。
1. AMF3をサポートします。 クライアントは標準の<mx:RemoteObject>コンポーネントを使用します。 つまり サーバーで使用する3つのフレームワークのいずれに関係なく、Flexアプリケーションでは作業方法は同じです。
2. FlexとPHPの間のクラスマッピング。
3. PHP5サポート
AMFPHP
利点:
1. php_amf拡張機能のサポート。フレームワークのパフォーマンスを向上させることがあります。 オブジェクトコーディングはC ++で実装されているため、AMFPHPはFlash用の最速のRPCフレームワークになります。
2.さまざまなエンコーディングの便利なサポート
3.サービス用のHTMLブラウザー。 Flexを使用せずにサーバーコードをテストおよびデバッグできます。 ブラウザを使用して、メソッドの結果と速度を取得できます。
4.組み込みの認証ツール
5. PHP4 / PHP5で動作し、追加のライブラリを必要としません
6.リクエスト/レスポンスのロギング
7. JSONサポート
8. XMLRPCサポート
9.多くのフレームワークに統合(Drupal、WordPress ...)
10.インストールが簡単
短所:
1.ドキュメントが不足しています。
2. 1人で実行します(Patrick Mineault)。
3.クラスをマップするには追加の手順が必要です。
4. E_STRICTをサポートしていません。その理由は明らかです。
WEBORB
利点:
1. .NET、JAVA、Ruby用の同様の製品を開発するWebORBによって開発されました。
2.クラスを完全に自動的に比較します
3.組み込みの認証ツール
4.ロギング
5.インストールが簡単
短所:
1.ほとんどドキュメントがありません
2.エンコーディングでの作業が不便
3. PHP4をサポートしていません
4.サービス用のHTMLブラウザーはありません
サブレアフ
利点:
1.軽量で、最も必要なことだけを行います。
短所
1.実質的にドキュメントはありません。
2. 1人でサポートされています。
3.承認ツールはありません。
4.サービス用のHTMLブラウザーはありません。
5. PHP4をサポートしていません。
6.ロギングなし。
7.インストールと構成のために、いくつかの不透明な手順を実行する必要があります。これらの手順は、異なる場所に分けて説明されています。
8.エンコーディングでの作業が不便
もちろん、フレームワークのいずれかの選択はあなた次第です。 しかし、私にとってはとても明白です。 AMFPHPは最も経験豊富な戦闘機であり、他の誰よりもはるかに優れています。 WEBORBは、その製品ラインのおかげで大きな可能性を秘めています。 WEBORBは、PHP用の有料のエンタープライズバージョンを計画しています。 SabreAMFの運命は疑問です。
フレームワークを使用する
フレームワークを操作するためのFlex Builderの構成。
Flex Builderで「ダミー」などの新しいプロジェクトを作成します。 プロジェクトのルートで、サービスの構成ファイルservices-config.xmlを作成します。
<?xml version="1.0" encoding="UTF-8"?> <services-config> <services> <service id="remoting-service" class="flex.messaging.services.RemotingService" messageTypes="flex.messaging.messages.RemotingMessage"> <default-channels> <channel ref="my-amf"/> </default-channels> <destination id="users"> <properties> <source>*</source> </properties> </destination> </service> </services> <channels> <channel-definition id="my-amf" class="mx.messaging.channels.AMFChannel"> <endpoint uri="http://localhost/amfphp_1.9/gateway.php" class="flex.messaging.endpoints.AMFEndpoint"/> <!---<endpoint uri="http://localhost/weborb/weborb/index.php" class="flex.messaging.endpoints.AMFEndpoint"/>--> <!---<endpoint uri="http://localhost/sabreamf/gateway.php" class="flex.messaging.endpoints.AMFEndpoint"/>--> </channel-definition> </channels> </services-config>
<?xml version="1.0" encoding="UTF-8"?> <services-config> <services> <service id="remoting-service" class="flex.messaging.services.RemotingService" messageTypes="flex.messaging.messages.RemotingMessage"> <default-channels> <channel ref="my-amf"/> </default-channels> <destination id="users"> <properties> <source>*</source> </properties> </destination> </service> </services> <channels> <channel-definition id="my-amf" class="mx.messaging.channels.AMFChannel"> <endpoint uri="http://localhost/amfphp_1.9/gateway.php" class="flex.messaging.endpoints.AMFEndpoint"/> <!---<endpoint uri="http://localhost/weborb/weborb/index.php" class="flex.messaging.endpoints.AMFEndpoint"/>--> <!---<endpoint uri="http://localhost/sabreamf/gateway.php" class="flex.messaging.endpoints.AMFEndpoint"/>--> </channel-definition> </channels> </services-config>
次に、構成ファイルの場所をコンパイラーに示します。これを行うには、プロジェクトプロパティダイアログボックスを見て、コンパイラ(Flexコンパイラ)のプロパティで–servicesディレクティブを指定します。図6のように。
図 6
上記のファイルは、3つのフレームワークすべてで機能します。
WebORBを使用する場合、ファイルはweborb / WEB-INF / Flex / services-config.xmlディレクトリに配置する必要があります。
フレームワークのインストール。
AMFPHPとWebORBのインストールは簡単で簡単です。ディストリビューションをダウンロードして、たとえばルートディレクトリなどのサーバーに解凍するだけです。その後、フレームワークのservicesディレクトリにファイルを配置することにより、すぐに作業を開始できます。
ただし、SabreAMFのインストールと構成では、不十分なドキュメントを考慮して問題が発生する場合があります。 pearインストーラーを使用してSabreAMFパッケージをインストールし、Adobe Webサイトのマニュアルを使用してSabreAMFを構成する必要があります。マニュアルをダウンロードします。
すべての例は、3つのフレームワークすべてで問題なく動作します。そこでコピーするだけです。
エンコード。
AMFPHPは、さまざまなエンコーディングでの作業を提供します。必要なことは、メッセージとエンコードをトランスコードするライブラリを選択することだけです。エンコーディングは、フレームワークのルートにあるgateway.phpファイルで設定されます。行$ gateway-> setCharsetHandler( "utf8_decode"、 "ISO-8859-1"、 "ISO-8859-1");を見つけます。必要なパラメーターに置き換えます。Flashはutf-8エンコーディングで動作します。
他のすべてのフレームワークでは、そのような機能は認識されなかったため、変換は手動で行う必要があります。
データベースからの簡単なデータ取得の例。
フレックス:
dummy.mxml
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <![CDATA[ import mx.controls.Alert; import mx.rpc.events.FaultEvent; import mx.rpc.events.ResultEvent; // private function resultHandler(event:ResultEvent):void { dg.dataProvider = event.result; } // private function faultHandler(event:FaultEvent):void { Alert.show(event.fault.faultString,"Error"); } ]]> </mx:Script> <mx:RemoteObject id="ro" result="resultHandler(event)" fault="faultHandler(event)" showBusyCursor="true" destination="users" source="dummy.Users"/> <mx:DataGrid id="dg" x="10" y="40" width="746" height="500"> </mx:DataGrid> <mx:Button x="10" y="10" label=" " click="ro.getUsers()"/> </mx:Application>
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <![CDATA[ import mx.controls.Alert; import mx.rpc.events.FaultEvent; import mx.rpc.events.ResultEvent; // private function resultHandler(event:ResultEvent):void { dg.dataProvider = event.result; } // private function faultHandler(event:FaultEvent):void { Alert.show(event.fault.faultString,"Error"); } ]]> </mx:Script> <mx:RemoteObject id="ro" result="resultHandler(event)" fault="faultHandler(event)" showBusyCursor="true" destination="users" source="dummy.Users"/> <mx:DataGrid id="dg" x="10" y="40" width="746" height="500"> </mx:DataGrid> <mx:Button x="10" y="10" label=" " click="ro.getUsers()"/> </mx:Application>
PHP:
Users.php
<?php class Users { public function __construct() { mysql_connect(“localhost”,”root”,”password”); mysql_select_db(“db_name”); } public function getUsers() { $users = array(); $query = mysql_query("select * from users"); while ($row = mysql_fetch_object($query)) { $users[] = $row; } return $users; } } ?>
<?php class Users { public function __construct() { mysql_connect(“localhost”,”root”,”password”); mysql_select_db(“db_name”); } public function getUsers() { $users = array(); $query = mysql_query("select * from users"); while ($row = mysql_fetch_object($query)) { $users[] = $row; } return $users; } } ?>
クラスマッピングの例:
WebORBはクラスを完全に自動的にマッピングします。
AMFPHPの場合、いくつかの設定が必要です
。1.マップされたすべてのクラスには
、オブジェクトのタイプを示す$ _explicitType プロパティが含まれている必要があります。
この例では、$ _explicitType = "dummy.vo.UserVO";
2.フレームワークのルートにあるglobals.phpファイルで、マッピングするクラスの場所を指定する必要があります。この例では、$ voPath = $ servicesPathを設定します。これは、Flexアプリケーションから渡されたクラスを正しく比較するために必要です。
Flex:
UserVOクラスを作成し、vo:
UserVO.asフォルダーに保存します
package vo { [RemoteClass(alias="dummy.vo.UserVO")] public class UserVO { public var userId:int; public var userName:String; } }
package vo { [RemoteClass(alias="dummy.vo.UserVO")] public class UserVO { public var userId:int; public var userName:String; } }
クラスをサーバー上のクラスにマッピングするには、メタデータ[RemoteClass(alias = "class")]を指定することで、クラスの名前を指定する必要があります。
次に、サーバー上に同様のクラスを作成し、voフォルダーに保存します:
UserVO.php
<?php class UserVO { public $_explicitType = "dummy.vo.UserVO"; public $userId; public $userName; } ?>
<?php class UserVO { public $_explicitType = "dummy.vo.UserVO"; public $userId; public $userName; } ?>
dummy.mxml
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <![CDATA[ import mx.controls.Alert; import mx.rpc.events.FaultEvent; import mx.rpc.events.ResultEvent; import vo.UserVO; private var user:UserVO; // private function resultHandler(event:ResultEvent):void { // UserVO dg.dataProvider = event.result; } // private function faultHandler(event:FaultEvent):void { Alert.show(event.fault.faultString,"Error"); } ]]> </mx:Script> <mx:RemoteObject id="ro" result="resultHandler(event)" fault="faultHandler(event)" showBusyCursor="true" destination="users" source="dummy.Users"/> <mx:DataGrid id="dg" x="10" y="40" width="700" height="500"> </mx:DataGrid> <mx:Button x="10" y="10" label=" " click="ro.getUsers()"/> </mx:Application>
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <![CDATA[ import mx.controls.Alert; import mx.rpc.events.FaultEvent; import mx.rpc.events.ResultEvent; import vo.UserVO; private var user:UserVO; // private function resultHandler(event:ResultEvent):void { // UserVO dg.dataProvider = event.result; } // private function faultHandler(event:FaultEvent):void { Alert.show(event.fault.faultString,"Error"); } ]]> </mx:Script> <mx:RemoteObject id="ro" result="resultHandler(event)" fault="faultHandler(event)" showBusyCursor="true" destination="users" source="dummy.Users"/> <mx:DataGrid id="dg" x="10" y="40" width="700" height="500"> </mx:DataGrid> <mx:Button x="10" y="10" label=" " click="ro.getUsers()"/> </mx:Application>
また、Users.phpを少し調整します。
PHP:
Users.php
<?php class Users { // UserVO require_once(“vo/UserVO.php”); public function __construct() { mysql_connect(“localhost”,”root”,”password”); mysql_select_db(“db_name”); } public function getUsers() { $users = array(); $query = mysql_query("SELECT user_id, user_name FROM users"); while ($row = mysql_fetch_object($query)) { $user = new UserVO(); $user->userId = $row->user_id; $user->userName = $row->user_name; $users[] = $user; } return $users; } } ?>
<?php class Users { // UserVO require_once(“vo/UserVO.php”); public function __construct() { mysql_connect(“localhost”,”root”,”password”); mysql_select_db(“db_name”); } public function getUsers() { $users = array(); $query = mysql_query("SELECT user_id, user_name FROM users"); while ($row = mysql_fetch_object($query)) { $user = new UserVO(); $user->userId = $row->user_id; $user->userName = $row->user_name; $users[] = $user; } return $users; } } ?>
サーバーに引数を渡すには、メソッドを呼び出すときに適切な順序で引数を指定するだけです。たとえば、新しいユーザーを作成します。
フレックス:
dummy.mxml
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <![CDATA[ import mx.controls.Alert; import mx.rpc.events.FaultEvent; import mx.rpc.events.ResultEvent; import vo.UserVO; private var user:UserVO; // private function resultHandler(event:ResultEvent):void { // UserVO dg.dataProvider = event.result; } // private function faultHandler(event:FaultEvent):void { Alert.show(event.fault.faultString,"Error"); } // private function createNewUser():void { var newUser:UserVO = new UserVO(); newUser.userName = uName.text; ro.createNewUser(newUser); } ]]> </mx:Script> <mx:RemoteObject id="ro" result="resultHandler(event)" fault="faultHandler(event)" showBusyCursor="true" destination="users" source="dummy.Users"/> <mx:DataGrid id="dg" x="10" y="40" width="600" height="500"> </mx:DataGrid> <mx:Button x="10" y="10" label=" " click="ro.getUsers()"/> <mx:Panel x="618" y="40" width="279" height="155" layout="absolute" title=" "> <mx:Form x="10" y="10"> <mx:FormItem label=":" required="true"> <mx:TextInput id="uName"/> </mx:FormItem> </mx:Form> <mx:Button x="89" y="83" label="" click="createNewUser()"/> </mx:Panel> </mx:Application>
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <![CDATA[ import mx.controls.Alert; import mx.rpc.events.FaultEvent; import mx.rpc.events.ResultEvent; import vo.UserVO; private var user:UserVO; // private function resultHandler(event:ResultEvent):void { // UserVO dg.dataProvider = event.result; } // private function faultHandler(event:FaultEvent):void { Alert.show(event.fault.faultString,"Error"); } // private function createNewUser():void { var newUser:UserVO = new UserVO(); newUser.userName = uName.text; ro.createNewUser(newUser); } ]]> </mx:Script> <mx:RemoteObject id="ro" result="resultHandler(event)" fault="faultHandler(event)" showBusyCursor="true" destination="users" source="dummy.Users"/> <mx:DataGrid id="dg" x="10" y="40" width="600" height="500"> </mx:DataGrid> <mx:Button x="10" y="10" label=" " click="ro.getUsers()"/> <mx:Panel x="618" y="40" width="279" height="155" layout="absolute" title=" "> <mx:Form x="10" y="10"> <mx:FormItem label=":" required="true"> <mx:TextInput id="uName"/> </mx:FormItem> </mx:Form> <mx:Button x="89" y="83" label="" click="createNewUser()"/> </mx:Panel> </mx:Application>
PHP:
Users.php
<?php class Users { // UserVO require_once(“vo/UserVO.php”); public function __construct() { mysql_connect(“localhost”,”root”,”password”); mysql_select_db(“db_name”); } public function getUsers() { $users = array(); $query = mysql_query("SELECT user_id, user_name FROM users"); while ($row = mysql_fetch_object($query)) { $user = new UserVO(); $user->userId = $row->user_id; $user->username = $row->user_name; $users[] = $user; } return $users; } public function createNewUser (UserVO $newUser) { mysql_query("INSERT INTO users SET user_name = '" . $newUser->userName . "'"); return $this->getUsers(); } ?>
<?php class Users { // UserVO require_once(“vo/UserVO.php”); public function __construct() { mysql_connect(“localhost”,”root”,”password”); mysql_select_db(“db_name”); } public function getUsers() { $users = array(); $query = mysql_query("SELECT user_id, user_name FROM users"); while ($row = mysql_fetch_object($query)) { $user = new UserVO(); $user->userId = $row->user_id; $user->username = $row->user_name; $users[] = $user; } return $users; } public function createNewUser (UserVO $newUser) { mysql_query("INSERT INTO users SET user_name = '" . $newUser->userName . "'"); return $this->getUsers(); } ?>
便利なリンク
www.adobe.com/products/flex-実際の出発点、メーカーの公式ウェブサイト。
flex.org-多くのFlexスタッフ。開発者ブログなどへのリンクを読むことを強くお勧めします。
www.cflex.net-記事、ライブラリ。
www.quietlyscheming.com/blog-Ely Greenfieldのブログ。ソースとともに素晴らしいコンポーネントを起動します。
グループ:
groups.yahoo.com/group/flexcoders
groups.yahoo.com/group/flexcomponents
groups.google.com/group/ruflex?lnk=srg&hl=en
video.onflex.org -Flexテクノロジーに関するビデオ資料。