BT

BlazeDSとAMFでWebとデスクトップのアプリケーションを構築する

| 作者 James Ward フォローする 0 人のフォロワー , Shashank Tiwari フォローする 0 人のフォロワー , 翻訳者 松本 清一 フォローする 0 人のフォロワー 投稿日 2008年6月24日. 推定読書時間: 18 分 |

Adobe AIRによるデスクトップ上で動作するアプリケーション、あるいはFlashプレーヤーによるブラウザ内で動作するアプリケーションは、通常、データをロードしたり加工する際にサーバーと接続します。開発者は、サーバーとアプリケーションが通信するための選択肢を多く持つAdobe FlexやFlash CS3といったツールを利用することで、それらのアプリケーションを構築します。サーバー自体は、Java、ColdFusion、.Net、PHP、 Rubyなどの多くのサーバーサイド技術で実行することができます。特定のサーバーサイド技術によらず、Flash PlayerやAdobe AIRでサーバーとの通信を必要とするクライアントサイドのアプリケーションを実行するときには、何かしらのネットワーク通信が必要となります。通常、そういった通信はHTTP(WebページやWebアプリケーションをロードするためのWebブラウザで使用されているものと同じプロトコル)が利用されます。しかし、どういったデータがHTTP上を通過するかの違いによって、開発者の生産性のみならずアプリケーションのパフォーマンスが大きく変わります。

クライアントとサーバー間のデータのやりとりのために、Adobe AIRやFlash Playerで実行される多くのアプリケーションは、SOAPやRESTといったHTTP上のXML技術を利用します。この方法は、準備が単純でとても容易です。テキストベースのプロトコルであるため、あらゆるサーバー技術でXMLを容易に扱うことができます。プロトコルの透過性が必要なときに、XMLはうってつけです。例えば、HTTP上のRESTful形式のXMLを利用したFlickrのWebサービスがあります。さまざまな技術を使う全ての開発者が、単純なテキストペースのリクエストをFlickrに送信することによって、Flickrとのインタラクションを容易にすることができます。 Flickrは単純なXMLを返し、開発者がデータを使用したりパースするのを容易にします。XMLのようなテキストベースのプロトコルのマイナス面として、データの抽象化によるレイヤーの追加が、大抵の場合、実装と保守にとって厄介なものとなります。加えて、そのデータ抽象化レイヤーは、データがシリアライズ/デシリアライズされるときにサーバー側とクライアント側でリソースを消費します。(図1参照)

Figure 1. AMFにより、通信上でのデータのマーシャルのためのレイヤーを減らします

以前から、Flashプレイヤーはテキストベースのプロトコルに付随する不要なボトルネックを軽減し、サーバーと通信するためのより単純な方法を開発者に提供するためのトランスポートプロトコルをサポートしていました。それは、Action Message Format (AMF)と呼ばれるもので、XMLを転送するテキストベースのプロトコルの代わりに、HTTPで利用することのできるデータ交換のためのバイナリプロトコルです。AMFを使用したアプリケーションは、不要なデータ抽象化レイヤーを排除し、サーバーとより効率的に通信をおこなうことができます。AMFのパフォーマンスの優位性を見るには、Census RIA のベンチマークアプリケーションを(source)確認してください。

ここ数年にわたって、Flash Remotingと呼ばれる旧Macromediaの製品と同様のAMF実装を提供するために、多くのオープンソースプロジェクトが登場しました。これらのプロジェクトは、アプリケーションでAMFを使用するために、開発者がPHP、Java、その他の技術を利用することができます。Flex 1.0がリリースされたときには、AMFの機能も含まれていました。Flex 2がリリースされたときには、XMLとAMFの機能が含まれていました。ただし、サーバーサイドのAMFの機能は、Flex Data Servicesと呼ばれる新しい製品に移行されました。Flex Data Servicesは、Live Cycle製品スイートに組み込まれ、LiveCycle Data Services ESとなりました。LiveCycle Data Services ES ExpressがシングルCPUサーバーに対し無料となりましたが、それより多いCPUを持つサーバーに対する価格設定は、一部の開発者にAMFを使用することを思いとどまらせるか、あるいは他の標準でないAMF実装を選択させる結果となりました。

2007 年12月、アドビは、AMFの優位性を誰もが享受できるようにするための2つの重要な発表をしました。第一の発表は、AMFの仕様が公的に入手可能となったことです。仕様を公開することで、他のプロジェクトが、プロトコルのリバースエンジニアリングをするのではなく、仕様に基づいたAMF実装をすることができるようになりました。開発者がどのようなバックエンド技術(Java、ColdFusion、PHP、.Net、Rubyなど)を使用するとしても、 AMF実装が仕様に準拠させることができます。第二の重要な発表は、LiveCycle Data Services ESの技術の一部が、BlazeDSと呼ばれるプロジェクトとしてオープンソース化されたことです。

BlazeDS は、AMFのJava実装を含み、それは、クライアント間のメッセージパッシングに対してのみならず、サーバーサイドのJavaオブジェクトとのリモート通信として利用することができます。BlazeDSのリモート技術により、開発者がPlain old Java objects (POJO)、Springサービス、EJBでのメソッド呼び出しを容易におこなえるようになります。開発者は、クライアントからサーバーへ、あるいはサーバーからクライアントへメッセージを容易に送信するためのメッセージングシステムを使用することができます。BlazeDSは、JMSや ActiveMQといった他のメッセージングシステムと関連付けることも可能です。リモーティングとメッセージング技術はHTTPでAMFを使用するため、単に付加的なデータ抽象化レイヤーを扱う必要が無いだけでなく、AMFのパフォーマンスメリットも享受することができます。BlazeDSは、 Tomcat、WebSphere、WebLogic、JBoss、ColdFusionを含む、幅広いJavaベースのアプリケーションサーバーで動作します。さらに、BlazeDSは、(Flashプレーヤーで動作する)FlexのWebアプリケーションや、(Adobe AIRで動作する)Flexのデスクトップアプリケーションを簡単に利用することができます。

開発者は、Adobe Labsから(サイト・英語)プレリリースバージョン(※1)をダウンロードすることで(source)、今すぐBlazeDSを使うことができます。まず初めに、サーブレットコンテナにblazeds-samples.warファイルを単純にデプロイします。このWebアプリケーションには、http://localhost:8080/blazeds-samples/でアクセスすることができる設定済みのサンプルアプリケーションがいくつか含まれています。(ポートは、使用しているアプリケーションサーバーやサーバーの設定によって異なるかもしれません)

あなたのアプリケーションでBlazeDSリモーティングサービスを使い始めるために、以下の簡単なステップに従います。

  1. POJOのJavaクラスを新規に作成し、Flexアプリケーションからアクセスしたいメソッドを公開します。
  2. BlazeDSでは、remoting-config.xmlファイルにBlazeDS remoting destinationを設定します
  3. RemoteObject クラスを使用するFlexアプリケーションを作成します

BlazeDSメッセージングサービスを使用するために、以下の簡単なステップに従います。

  1. messaging-config.xmlファイルに、messaging destinationを設定します
  2. メッセージの送受信のために、プロデューサとコンシューマを使用したFlexアプリケーションを作成します
  3. コンシューマのメッセージフィードによるメッセージのリスンを開始します

以上が、バックエンドのJavaオブジェクトに対しリモートリクエストを効果的に行うのと、BlazeDSによるメッセージングシステムを利用するために必要なこと全てです!EclipseとFlex Builderを使用して、これらのステップをもう少し詳細に見ていくことにしましょう。以下のソフトウェアがインストールされている必要があります。

  • Eclipse 3.3 クラシック(source)
  • Flex Builder 3 ベータ3(source)(※2) (Eclipseプラグイン版)
  • Javaアプリケーションサーバー(Tomcat、JBoss、WebLogic、WebSphereなど)
  • BlazeDS(source)

(※2)現在、正式版がリリースされています。

単純なリモーティングアプリケーションを作成するには、以下の手順に従います。

  1. BlazeDSから取得したblazeds.warファイルを、アプリケーションサーバーのデプロイメントフォルダに置きます。例えば、JBossの場合は、/server/default /deploy/blazeds.warとなります。
  2. Eclipse / Flex Builderを起動します。
  3. BlazeDSの構成を利用するために新規Javaプロジェクトを作成し、JavaのクラスをWebアプリケーションに追加します。
    1. プロジェクト名は「blazeds_server」とします。
    2. 「既存のソースからプロジェクトを作成」で、BlazeDSのWARのWEB-INFディレクトリのパスを指定します。例えば、/server/default/deploy/blazeds.war/WEB-INF/ となります。
    3. srcディレクトリをビルドバスに追加します。
    4. 出力先フォルダとしてWEB-INF/classesディレクトリを指定します。
  4. HelloWorld.javaという名前のクラスを新規作成し、以下のコードを記述します。
    public class HelloWorld {
    public String sayHello(String name) {
    return "hello, " + name;
    }
    }
  5. WEB- INF/flexディレクトリにあるremoting-config.xmlファイルにdestinationを追加することで、HelloWorldクラスに対するリモートリクエストを可能にするためにBlazeDSを構成します。以下のdestinationを設定します。WEB- INF/flexディレクトリにあるremoting-config.xmlファイルにdestinationを追加することで、HelloWorldクラスに対するリモートリクエストを可能にするためにBlazeDSを構成します。以下のdestinationを設定します。
    <destination id="HelloWorld">
    <properties>
    <source>HelloWorld</source>
    </properties>
    </destination>
  6. アプリケーションサーバーを起動し、Webアプリケーションが次のURLで作成されていることを確認します。(ポート番号は、アプリケーションサーバーの設定によって異なるかもしれません) http://localhost:8080/blazeds/ (サーバーがディレクトリの内容を表示しない設定となっている場合、404エラーとなりますが、問題ありません)
  7. 新規にFlexプロジェクトを作成します。
    1. プロジェクト名を「testHelloWorld」とします。 Select "J2EE" as the Application Server Type
    2. アプリケーションサーバーの種類は「J2EE」を指定してください。 「リモートオブジェクトアクセスサービスを使用」をチェックし、LiveCycle Data Servicesを選択します。
    3. ルートフォルダに、WARファイルをデプロイした場所を指定します。
    4. ルートURLに、http://localhost:8080/blazedsを指定します。 (ポート番号は、アプリケーションサーバーの設定によって異なるかもしれません)
    5. コンテキストルートに、/blazedsを指定します。
    6. 設定を確認し、終了を押下します。
  8. 以下のソースコードでtestHelloWorld.mxmlファイルを置き換えることで、Flexアプリケーションを作成します。
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:RemoteObject id="ro" destination="HelloWorld"/>
    <mx:TextInput id="n" change="ro.sayHello(n.text)"/>
    <mx:Label text="{ro.sayHello.lastResult}"/>
    </mx:Application>
  9. アプリケーションを実行し、あなたの名前をTextInputに入力してみます。下の画像のように、すぐ下のTextInputに「hello, <あなたの名前>」が表示されるのを確認できます。

解説:Flexアプリケーションは、BlazeDS対応サーバーと通信するためのRemoteObjectライブラリを使用しています。ユーザーが TextInputボックスに文字を入力すると、変更イベントによりRemoteObjectがサーバーにリクエストします。そして、サーバーは remoting destinationの設定で指定されたJavaクラスにリクエストします。これはSpringサービスやEJBセッションビーンを呼ぶこともできますが、この例では単純にPOJOを呼んでいます。そのPOJOのクラスの返り値は、"hello, "を付加した単純な名前の文字列です。オブジェクトが値を返すとき、その値はAMFにシリアライズされてFlexアプリケーションに返ります。そして、 RemoteObjectライブラリは、ro..lastResult プロパティに返り値をセットします(今回は、ro.sayHello.lastResult)。その結果は、RemoteObjectでのresultイベントを通して取得することもできます。データバインディングは、POJOのクラスから返された文字列をラベルに表示するトリガーとなります。BlazeDSでは、Javaオブジェクトのやりとりもサポートしています。

次に、BlazeDSメッセージングシステムを使用した、新たなFlexアプリケーションを構築します。

  1. WEB-INF/flexディレクトリにあるmessaging-config.xml ファイルにmessaging destinationを追加することから始めます。以下のdestinationを追加します。
    <destination id="chat"/> 
    messaging destinationはメッセージシステムがdestinationで受信しているクライアントにメッセージを中継するのを許可します。そして、それはメッセージをdestinationへ送信するのも許可します。Messaging destinationsは耐久性とネットワークパラメータを持ち、JMSのような他のメッセージングシステムと接続する機能を持ちます。
  2. BlazeDSで新しいmessaging destinationを構成するために、アプリケーションサーバーを再起動します。
  3. 新規Flexプロジェクトを作成します。
    1. プロジェクト名を「testChat」とします。
    2. アプリケーションサーバーの種類として「J2EE」を指定します。
    3. 「リモートオブジェクトアクセスサービスを使用」をチェックし、LiveCycle Data Servicesを選択します。
    4. ルートフォルダのに、WARファイルをデプロイした場所を指定します。
    5. ルートURLに、http://localhost:8080/blazedsを指定します。 (ポート番号は、アプリケーションサーバーの設定によって異なるかもしれません)
    6. コンテキストルートに、/blazedsを指定します。
    7. 設定を確認し、終了を押下します。
  4. メッセージングシステムを使用した単純なチャットアプリケーションを作成するために、testChat.mxmlファイルを以下のコードで置き換えます。
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="cons.subscribe()">

    <mx:Script>
    import mx.messaging.messages.AsyncMessage;
    </mx:Script>
    <mx:Producer id="prod" destination="chat"/>
    <mx:Consumer id="cons" destination="chat" message="c.text += event.message.body.msg + '\n'"/>

    <mx:TextArea id="c" width="300" height="300"/>
    <mx:TextInput id="m"/>
    <mx:Button label="Send" click="prod.send(new AsyncMessage({msg: m.text}))"/>

    </mx:Application>
  5. アプリケーションを実行します。下のTextInput にメッセージを入力し、Enterを押下してください。下の画像にあるように、上にあるボックス内にメッセージが表示されることが確認できます。複数のブラウザを開き、それら全てにメッセージが表示されることも確認してください。

解説:プロデューサーオブジェクトにより、Flexアプリケーションがメッセージをメッセージングシステムへ送信できます。(例では使用しませんでしたが)JavaのAPIもあり、メッセージをサーバーのメッセージングシステムに送信することもできます。カスタムアダプタや、すぐに利用可能なJMSアダプタにより、メッセージングシステムから他のメッセージングシステムに接続することもできます。しかし、デフォルトのメッセージングシステムはスタンドアロンで動作します。ユーザーが「Send」ボタンを押下すると、無名オブジェクトを使用して新たにメッセージが作成され、TextInputの値をメッセージのボディとして、msgプロパティにセットします。メッセージの型はAsyncMessageなので、そのクラスをインポートする必要があります。コンシューマオブジェクトにより、Flexアプリケーションがメッセージをリスンすることができます。アプリケーションが初期化されると、それはメッセージングシステムにサブスクライブされます。そして、メッセージが受信されると、コンシューマのイベントハンドラはメッセージボディ部からチャットメッセージをとりだし、TextAreaに追加します。

BlazeDSとAMFを使うことで、あなたの開発時間削減の手助けとなり、アプリケーションがより速く動作するための手助けとなるでしょう。BlazeDSを試してみて、あなたがどう感じたかを私たちに教えてください!Adobe LabsのBlazeDSのページから(source)、BlazeDSとopen AMFの仕様についてもっと知ることができます。

著者について

James Ward氏は、Adobe Flexのテクニカルエバンジェリストであり、JSR 286、299、301に対するアドビのJCP代表です。彼は山登りがとても好きですが、それと同じくらいプログラミングを楽しんでいます。というのも、それが終わりなき新たな発見やエレガントな対処を提供し、山や谷があるからです。彼の山登りの冒険は、さまざまな場所へと彼の足を運ばせます。同じように、技術も彼に多くの冒険をもたらします。例えば、90年代初めにはPascalやアセンブラ、90年代中にはPerl、HTML、 JavaScript、そして、90年代後半には、Javaとそれに関連する多くのフレームワークなどです。現在、彼は主にJavaベースのバックエンドに対し美しいフロントエンドを構築するためにFlexを利用しています。アドビでの作業をメインとし、リッチクライアント市場とPillar Data Systems社の顧客サービス向けポータルを構築しています。James Ward氏のブログは、http://www.jamesward.orgです。

Shashank Tiwari氏は、Saven Technologies社(銀行と金融サービス会社へのビジネスソリューションで、最先端の技術を提供するシカゴの会社です)のチーフテクノロジストです。Shashank氏は、開発者、執筆者、スピーカーと経験豊富で、JSR274、283、299、301、312のエキスパートグループメンバーとしてJCPで意欲的に活動しています。加えて、Java、ActionScript、Python、Perl、PHP、C++、Groovy、 JavaScript、Ruby、Matlabを含む、少なくとも1ダース(12)の言語のプログラムを活発におこなっています。彼は、O'Reilly Networkで人気のブロガーでもあります。現在は、FlexとJavaを使用したWeb2.0アプリケーションの構築で多忙な日々を送っています。彼に関するより詳しい情報は、www.shanky.orgを参照してください。

原文はこちらです:http://www.infoq.com/articles/blazeds-intro

この記事に星をつける

おすすめ度
スタイル

こんにちは

コメントするには InfoQアカウントの登録 または が必要です。InfoQ に登録するとさまざまなことができます。

アカウント登録をしてInfoQをお楽しみください。

あなたの意見をお聞かせください。

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

このスレッドのメッセージについてEmailでリプライする
コミュニティコメント

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

このスレッドのメッセージについてEmailでリプライする

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

このスレッドのメッセージについてEmailでリプライする

ディスカッション

InfoQにログインし新機能を利用する


パスワードを忘れた方はこちらへ

Follow

お気に入りのトピックや著者をフォローする

業界やサイト内で一番重要な見出しを閲覧する

Like

より多いシグナル、より少ないノイズ

お気に入りのトピックと著者を選択して自分のフィードを作る

Notifications

最新情報をすぐ手に入れるようにしよう

通知設定をして、お気に入りコンテンツを見逃さないようにしよう!

BT