Flex-deploy-application

提供:Dev Guides
移動先:案内検索

Flex-アプリケーションのデプロイ

このチュートリアルでは、アプリケーションの war ファイルを作成する方法と、それをApache Tomcat Webサーバーのルートにデプロイする方法を説明します。

この簡単な例を理解していれば、同じ手順に従って複雑なFlexアプリケーションをデプロイすることもできます。

私たちは次の手順に従ってFlexアプリケーションを作成しましょう-

Step Description
1 Create a project with a name HelloWorld under a packagecom.finddevguides.client as explained in the Flex - Create Application chapter.
2 Modify HelloWorld.mxml as explained below. Keep rest of the files unchanged.
3 Compile and run the application to make sure business logic is working as per the requirements.

以下の手順に従って、Flexアプリケーションのリリースビルドを作成し、それをTomcatサーバーにデプロイします-

最初のステップは、Flash Builder IDEを使用してリリースビルドを作成することです。 オプション File> Export> Flash Builder> Release Build を使用してリリースビルドウィザードを起動します。

ビルドのリリースウィザード

次のウィザードウィンドウを使用して、_HelloWorld_としてプロジェクトを選択します。

リリースビルドウィザード1

他のデフォルト値はそのままにして、[完了]ボタンをクリックします。 これで、Flash Builderはプロジェクトのリリースビルドを含むbin-releaseフォルダーを作成します。

これでリリースビルドの準備ができました。次の手順に従ってFlexアプリケーションをデプロイしましょう-

Step Description
1 Zip the content of the bin-release folder of the application in the form of HelloWorld.war file and deploy it in Apache Tomcat Webserver.
2 Launch your web application using appropriate URL as explained below in the last step.

以下は、変更されたmxmlファイルの内容です table table-bordered/com.finddevguides/HelloWorld.mxml

<?xml version = "1.0" encoding = "utf-8"?>
<s:Application xmlns:fx = "http://ns.adobe.com/mxml/2009"
   xmlns:s = "library://ns.adobe.com/flex/spark"
   xmlns:mx = "library://ns.adobe.com/flex/mx"
   width = "100%" height = "100%"
   minWidth = "500" minHeight = "500"
   initialize = "application_initializeHandler(event)">

   <fx:Style source = "/com/finddevguides/client/Style.css"/>
   <fx:Script>
      <![CDATA[
         import mx.controls.Alert;
         import mx.events.FlexEvent;
         protected function btnClickMe_clickHandler(event:MouseEvent):void {
            Alert.show("Hello World!");
         }

         protected function application_initializeHandler(event:FlexEvent):void {
            lblHeader.text = "My Hello World Application";
         }
      ]]>
   </fx:Script>

   <s:BorderContainer width = "500" height = "500" id = "mainContainer"
      styleName = "container">
      <s:VGroup width = "100%" height = "100%" gap = "50" horizontalAlign = "center"
         verticalAlign = "middle">
         <s:Label id = "lblHeader" fontSize = "40" color = "0x777777"
            styleName = "heading"/>
         <s:Button label = "Click Me!" id = "btnClickMe"
            click = "btnClickMe_clickHandler(event)" styleName = "button"/>
      </s:VGroup>
   </s:BorderContainer>
</s:Application>

すべての変更が完了したら、link:/flex/flex_create_application [Flex-アプリケーションの作成]の章で行ったように、アプリケーションを通常モードでコンパイルして実行します。 アプリケーションに問題がなければ、次の結果が生成されます。[link:/flex/samples/CreateApplicationl [オンラインで試す]]

Flexアプリケーション結果

WARファイルを作成する

これでアプリケーションは正常に動作し、warファイルとしてエクスポートする準備が整いました。 次の手順に従ってください-

  • プロジェクトのbin-releaseディレクトリC:\ workspace \ HelloWorld \ binreleaseに移動します
  • bin-releaseディレクトリ内で使用可能なすべてのファイルとフォルダーを選択します。
  • 選択したすべてのファイルとフォルダーを_HelloWorld.zip_というファイルに圧縮します。
  • HelloWorld.zipの名前をHelloWorld.warに変更します。

WARファイルを展開する

Tomcatサーバーを停止します。

  • HelloWorld.warファイルをtomcatインストールディレクトリ> webappsフォルダーにコピーします。
  • Tomcatサーバーを起動します。
  • webappsディレクトリ内を見てください。HelloWorldが作成されているはずです。
  • これで、HelloWorld.warがTomcat Webサーバールートに正常にデプロイされました。

アプリケーションを実行

WebブラウザーでURLを入力します-**

http://localhost:8080/HelloWorld/HelloWorldlでアプリケーションを起動します。

サーバー名(localhost)とポート(8080)は、Tomcatの構成によって異なる場合があります。

Flexアプリケーション結果1