天天看點

使用BlazeDS與Flash Builder4.5整合Java EE應用(一)

前言

寫這篇文章的目的是對于一個完全不懂的新手,也能快速step by step建立Flex與Java EE的整合應用,開啟java與flex的企業級應用開發的第一頁。

開發環境及工具

windows 7

JAVA SDK 1.6.0_17

Flash Builder 4.5

SpringSource Tool Suite IDE

BlazeDS

之是以選用SpringSource Tool Suite IDE是因為常用的插件已經幫我們內建好,而且對于Spring的操作支援等自然不必說。

step by step create the demo

1. 首先使用SpringSource Tool Suite 建立我們的Dynamic Web Project項目命名為 BlazeJavaDemo。建立完成後更改預設的output folder為“BlazeJavaDemo/WebContent/WEB-INF/classes”

使用BlazeDS與Flash Builder4.5整合Java EE應用(一)

2. 解壓我們下載下傳的BlazeDS turnkey包在根目錄上我們會看到一系列目錄以及檔案包含doc,resource samples等,這裡就不做詳細介紹。我隻需要blazeds.war

使用BlazeDS與Flash Builder4.5整合Java EE應用(一)

3. 把blazeds.war放到我們的tomcat webapps目錄下,并啟動tomcat 熟悉java的都知道這就是一個釋出包。ok 定位到我們的blazeds\WEB-INF檔案夾下,

    大家會看到以下内容:

使用BlazeDS與Flash Builder4.5整合Java EE應用(一)

4. 把此所有内容copy到我們java項目\WEB-INF下并覆寫其所有原檔案。

    BlazeDS是java與flex通信的一個中間件,使用的是Adobe自家的AMF二進制傳輸協定,是開源的針對不同的開發語言都有其實作,其優點就是超高的傳輸速率以及效率,這也是為什麼企業級應用經常使用的原因。利用他我們可以非常友善的在flex中直接通路java對象,他的功能很強大更多資料請檢視Adobe官網。下面我們簡單寫一個java class并且通過blazeDS暴露給flex,完成我們第一個簡單的demo.

5. 很簡單的一個java class 他的作用就是接受flex端的參數,并且響應資訊給flex端。

/**
 * 
 */
package com.swq.services;

/**
 * @author Administrator
 *
 */
public class DemoService {

	/**
	 * 
	 */
	public DemoService() {
		// TODO Auto-generated constructor stub
	}
	
	/**
	 * 接收參數name并響應資訊到flex端
	 * @param name
	 * @return
	 */
	public String sayHello(String name){
		return "Hello "+name;
	}

}
           

6. 接着我們需要對remoting-config.xml做出如下配置告訴flex端 “hey 我在這裡”,如果多個類,在依次定義多個destination即可。到這裡我們已經完成了java端編寫及配置,是不是很簡單,如果你是一個完全不懂的新手能通過本篇文章完成flex與java通過blaze通信的話,說明此篇文章是成功了。

<destination id="demoservice">
	<properties>
		<source>com.swq.services.DemoService</source>
	</properties>
</destination>
           

7. 完成了java端,接下來我們看下使用Flash Builder4.5是怎樣建立與BlazeDS通信項目的

(1)建立名為BlazeFlexDemo的項目

使用BlazeDS與Flash Builder4.5整合Java EE應用(一)

(2)填寫正确的路徑之後驗證配置,無誤之後下一步完成flex項目的建立。

使用BlazeDS與Flash Builder4.5整合Java EE應用(一)

8. 完成了flex項目的建立接下來我們看下代碼,非常簡單的代碼。這裡要說明的是:在聲明RemoteObject元件的destination屬性一定要和remoting-config.xml中的destination對應,flex就是根據這個進行對應的,然後我們就可以通過其id屬性直接通路我們java端的方法了。endpoint屬性指定我們的終端位置,當我們java端釋出之後大家可以測試下http://localhost:8080/BlazeJavaDemo/messagebroker/amf如果正确說明我們的項目沒有問題。

<?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" minWidth="955" minHeight="600">
	
	<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import mx.rpc.events.FaultEvent;
			import mx.rpc.events.ResultEvent;
			
			[Bindable]
			public var tempString:String = "";
			protected function button1_clickHandler(event:MouseEvent):void
			{
				myService.sayHello(input.text);
			}
			
			protected function myService_resultHandler(event:ResultEvent):void
			{
				tempString += event.result +"\n";
				outPut.text = tempString;
			}
			
			
			protected function myService_faultHandler(event:FaultEvent):void
			{
				Alert.show(event.fault.message);
			}
			
		]]>
	</fx:Script>
	
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
		<s:RemoteObject id="myService" destination="demoservice"
						endpoint="http://localhost:8080/BlazeJavaDemo/messagebroker/amf" 
						result="myService_resultHandler(event)"
						fault="myService_faultHandler(event)"
						showBusyCursor="true"/>
	</fx:Declarations>
	
	<s:VGroup>
		<s:HGroup>
			<s:TextInput id="input"/>
			<s:Button label="Send" click="button1_clickHandler(event)"/>
		</s:HGroup>
		<s:TextArea id="outPut" width="100%">
			
		</s:TextArea>
	</s:VGroup>
</s:Application>
           

9. 上一張運作成功的頁面

使用BlazeDS與Flash Builder4.5整合Java EE應用(一)

總結:很簡單的代碼,很簡單的配置就完成了flex通過BlazeDS與Java通信,這方面的資料網上也有很多Google下一大堆,但是看到很多文章都不是很詳細。如果對于是完全的新手來說還是有一點難度是以就寫了這篇文章,如果你是個新手能通過本篇文章成功完成通信。那還是值得的。更多詳細的學習資源請通路Adobe官網。善于思考,善于學習,善于模仿。這就是程式猿必備的東西。

最後打個廣告http://weibo.com/allanshi 歡迎互粉關注O(∩_∩)O~