Flex同Java通訊–BlazeDS入門圖文詳解（上）

以前做項目時因為時間關係，囫圇吞棗狀態下完成了，現在回頭仔細研究了下究竟各種配置到底是什麼意思，起什麼作用，以一個什麼的流程來建立通過BlazeDS通訊的Flex+Java程式比較合理，在程式運行時遇到那些問題時是配置的原因，又怎樣去修改配置，讓一個代碼邏輯沒有問題的程式可以正常運行，現將研究的成果記錄下來，分享+備忘。

本篇文裡主要介紹如何建立一個工程，並設定好相應的配置。

後續將介紹項目如何正確同步到Tomcat伺服器，請期待Flex同Java通訊--Blazed入門圖文詳解（下）。

前期準備

    本文所用軟體：

Eclipse IDE for Java EE Developers

Flash Builder 4.5 Plugin-in 

Tomcat 7

BlazeDS 4

      以上軟體官網均可下載，或試用，或免費 ，或者最一了百了的方法——購買

    環境搭建：

      1.將Eclipse和FlashBuilder正確安裝，配置好JDK；

       2.Tomcat和BlazeDS解壓，將blazeds.war檔案解壓，放到此目錄中——\Tomcat7.0.12\webapps 。

建立Flex Project工程

       本文採用Flex和Java 放置在同一工程中的方式，根據嚮導提示建立工程，沒有什麼複雜的，稍微留心就可以，尤其是Flash Builder4.5，已經消除了之前設定某些參數無效的bug。

       1. 工程基本資料，其中FlexSDK可以根據自己的開發需要選擇；

 

       2. Java部分的設定

 

          Tips：Java source folder 用於放置Java代碼的檔案夾，名稱可以根據自身習慣設定；

                    Target runtime 配置好的Tomcat，此處必須選一個，否則無法進行建立；

                    Context root 用於設定將哪些URL請求通過Tomcat轉寄到Web應用，此處必須與工程名相同；

                    Content folder 這是最終編譯後的容器目錄，blazeds.war檔案將會發布到該目錄下的WEB-INF下的flex目錄中，此處需跟Context root 的設定一樣，

                    否則在使用RemoteObject與Java進行通訊時會報錯，目前還沒找到原因，若有明白人，望指點一下；若開發環境使用MyEclipse，將檔案名稱設定為

                    WebContent，可以自動部署；

                    Output folder 用於存放Flex編譯後的swf和html等檔案存放的路徑，若為了編譯檔案的整齊，可以選擇放在Content folder\bin等一個單獨檔案夾中，

                    因為習慣問題我設定為一樣的；

       3. Flex部分的設定

 

          Tips：Main source folder 用於放置Java代碼的檔案夾，名稱可以根據自身習慣設定；

                    Main application file 預設啟動並執行swf對應的代碼檔案；

                    Output folder url 程式啟動並執行主連結；

       產生的工程結構：

 

Flex與Java通訊的配置

       1.樣本後台Java類

          在"Demos/java_src”檔案夾下添加com.Demos.DemoServices類，其完整代碼如下：

   1:  package com.Demos;

   2:   

   3:  public class DemoServices {

   4:      public String testRemoteServices(String var1) {

   5:          return "Test is ok"  + var1;

   6:      }

   7:  }

       2.樣本前端Flex應用

          修改"Demos/flex_src”檔案夾下添加Demo.mxml檔案，其完整代碼如下：

   1:  <?xml version="1.0" encoding="utf-8"?>

   2:  <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 

   3:                 xmlns:s="library://ns.adobe.com/flex/spark" 

   4:                 xmlns:mx="library://ns.adobe.com/flex/mx" 

   5:                 minWidth="955" 

   6:                 minHeight="600">

   7:      <fx:Script>

   8:          <![CDATA[

   9:              import mx.rpc.events.FaultEvent;

  10:              import mx.rpc.events.ResultEvent;

  11:              

  12:              //用於返回結果正確時的處理事件

  13:              private function method1_resultHandler(event:ResultEvent):void

  14:              {

  15:                  testResult.text = event.result.toString();

  16:              }

  17:              

  18:              //用於返回結果錯誤時的處理事件

  19:              private function method1_faultHandler(event:FaultEvent):void

  20:              {

  21:                  

  22:              }

  23:              

  24:              private function button1_clickHandler(event:MouseEvent):void

  25:              {

  26:                  var testResults:String = testBtn.label;

  27:                  demoServices.testRemoteServices(testResults);    

  28:              }

  29:              

  30:          ]]>

  31:      </fx:Script>

  32:      

  33:      <fx:Declarations>

  34:          <s:RemoteObject destination="com.Demos.DemoServices" id="demoServices">

  35:              <s:method name="testRemoteServices" result="method1_resultHandler(event)"/>

  36:          </s:RemoteObject>

  37:      </fx:Declarations>

  38:      

  39:      <s:VGroup paddingTop="100" horizontalAlign="center" width="100%">

  40:          <s:Button id="testBtn" label="測試通訊" click="button1_clickHandler(event)"/>

  41:          <s:TextInput id="testResult"/>

  42:      </s:VGroup>

  43:  </s:Application>

       3.通訊配置

          代碼編寫完成後，首先將"Tomcat7.0.12\webapps\blazeds\WEB-INF”檔案夾拷貝替換"Demos\Demos\WEB-INF；然後需要修改位於

       "Demos\Demos\WEB-INF\flex”檔案夾中remoting-config.xml檔案，為其添加以下代碼：

   1:  <destination id="com.Demos.DemoServices">

   2:      <properties>

   3:          <source>com.Demos.DemoServices</source>

   4:      </properties>

   5:  </destination>

          Tips：id 也可以用代碼中的demoServices；

                    Source 一定要跟Java類的名稱完全一樣，否則會報找不到類或者沒有Channel的錯誤。

工程源碼： /Files/iloveWater/Demos.zip

擴充閱讀:

flex基本通訊方式比較及BlazeDS和LCDS比較（文中清晰介紹了BlazeDS所支援的功能，喜歡博主的圖文清晰，推薦一下）

flex與java--Blazeds學習（配置）（文中介紹了本文沒提到Flex+Java項目建立及配置方式，博文很清新，推薦）

Building a Flex application that connects to a BlazeDS Remoting destination using Flash Builder 4.5（文中的範例代碼就是來自於這裡，是官方的博，老外典型的教程，清晰，嚴謹，廢話木有，就是英文的）