使用BlazeDS实现Java和Flex通信之hello world

原创 2012年03月28日 16:20:13

http://zhan.zhmy.com/archives/2010/158552.html

【转】使用BlazeDS实现Java和Flex通信之hello world

1

新的项目对用户体验及用户互动要求较高,决定选用Flex作为前端的展现技术,整体框架仍然是Flex+Spring+Hibernate(考虑采用seam中)。作为入门,先从经典的Hello world开始,暂时不考虑Flex与Spring、Hibernate的集成。

Flex要实现与Java集成,开源项目BlazeDSGraniteDSFlamingo都提供了相应的解决方案,考虑到BlazeDS是Adobe官方的开源项目,因此采用BlazeDs作为Flex与Java通信的基础框架。什么是 BlazeDS呢,看看官方的介绍:

BlazeDS is the server-based Java remoting and web messaging technology that enables developers to easily connect to back-end distributed data and push data in real-time to Adobe? Flex? and Adobe AIR? applications for more responsive rich Internet application (RIA) experiences.

开发工具采用Eclipse+Flex Builder 3 Plug-in方式,不采用Flex Builder 3。先安装Eclipse,再安装Flex Builder 3 Plug-in,相关的安装配置不再赘述。

1、下载BlazeDS

下载BlazeDS Turnkey :http://flexorg.wip3.adobe.com/blazeds/3.0.x/milestone/3978/blazeds-turnkey-3.2.0.3978.zip

由于BlazeDS Turnkey中包含BlazeDS的使用例子,对于入门熟悉Flex及BlazeDS都有较好的参考价值,因此建议下载BlazeDS Turnkey。

关于blazeds-turnkey 的目录说明:

docs:BlazeDS Javadoc

resources:BlazeDS的相关支持包,包括clustering(采用jgroups)、BlazeDS与ColdFusion 集成的配置文件、BlazeDS的配置文件、BlazeDS与AJAX集成的桥、Flex的SDK、Flex的java library、BlazeDS与Tomcat、Jboss、Websphere等security集成的支持包。

sampledb:hsqldb的启动脚本及样例数据库

tomcat:Tomcat 包

blazeds.war:最小化的BlazeDS 文件,可以作为空白项目来建立BlazeDS 应用程序。

sample.war:BlazeDS的demo例子(所谓的testdrive)。

ds-console.war :BlazeDS的部署管理程序。

2、建立Java Web Project

File->New->Web Project 建立Java helloworld项目

在helloworld/src下,新建com.yeeach.HelloWorldService类,内容如下:

package com.yeeach;

public class HelloWorldService {
public String hello(String var1) {
return “hello ” + var1;
}
public String world(String var1) {
return “world ” + var1;
}
}

3、建立helloworld的BlazeDS开发环境

3.1、拷贝blazeds.war下的WEB-INF到helloworld的目录下,覆盖原有的WEB-INF

3.2、在helloworld下建立flex-src目录(与src同级),用于存放flex的相关代码

helloworld/src:用于存放项目的java代码

helloworld/flex-src:用于存放项目flex的相关代码

helloworld/WebRoot/WEB-INF/flex:存放flex的相关配置文件

3.3、设置Flex Project Nature

3.4、在helloworld/flex-src下,新建MXML Application :helloworld.mxml  ,内容如下:

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”
http://www.adobe.com/2006/mxml”
layout=”vertical”>
<mx:RemoteObject destination=”com.yeeach.HelloWorldService”
id=”helloWorldService”>
<mx:method name=”hello”
result=”sayHelloResult(event)”/>
<mx:method name=”world”
result=”sayWorldResult(event)”/>
</mx:RemoteObject>
<mx:HBox>
<mx:Label text=”输入:”/>
<mx:TextInput id=”inputStr”/>
<mx:Button label=”say hello”
click=”sayHello(event);”/>
<mx:Button label=”say world”
click=”sayWorld(event);”/>
</mx:HBox>
<mx:HBox>
<mx:Label text=”结果:”/>
<mx:TextArea id=”result”/>
</mx:HBox>

<mx:Script>

<![CDATA[
import mx.rpc.events.FaultEvent;
import mx.controls.Alert;
import mx.rpc.events.ResultEvent;

function sayHello(event:Event):void
{
var inputVar:String=inputStr.text;
helloWorldService.hello(inputVar);

}

function sayWorld(event:Event):void
{
var inputVar:String=inputStr.text;
helloWorldService.world(inputVar);

}

private function sayHelloResult(event:ResultEvent):void
{
result.text=event.result.toString();
Alert.show(event.result.toString(), "返回结果");
}

private function sayWorldResult(event:ResultEvent):void
{
result.text=event.result.toString();
Alert.show(event.result.toString(), "返回结果");
}
]]>
</mx:Script>
</mx:Application>

3.5、修改remoting-config.xml,增加对destination的说明

<destination id=”com.yeeach.HelloWorldService”>
<properties>
<source>com.yeeach.HelloWorldService</source>
</properties>
</destination>

3.6、设置Flex Build Path等相关属性

1)右键->Properties,设置Flex Build Path属性,将Main source folder修改为flex-src,然后点击“OK”

2)右键->Properties,设置Flex Applications属性,添加flex-src下的其他Application,然后点击“OK”

如果需要添加flex-src子目录下的其他Application(例如helloworld/flex-src/com/yeeach /helloworld1.mxml),目前从UI界面似乎无法正确添加,可以直接修改.actionScriptProperties, 在<applications></applications>中间增加相应的Application

<applications>
<application path=”helloworld.mxml”/>

<application path=”com/yeeach.com/helloworld1.mxml”/>
</applications>

3)右键->Properties,设置Flex Compiler属性,将Flex SDK version 修改为“Use default”或“Use a specific SDK”,指向正确的Flex SDK;确认“Additional compiler arguments”配置参数正确,然后点击“OK”

4)右键->Properties,设置Flex Server属性,配置为正确的参数,然后点击“OK”

3.7、部署helloworld 应用到Tomcat

通过http://127.0.0.1:8080/helloworld/helloworld.swf来访问我们的hello world

3.8、分析helloworld.mxml

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”
http://www.adobe.com/2006/mxml”
layout=”vertical”>
<mx:RemoteObject destination=”com.yeeach.HelloWorldService”
id=”helloWorldService”>

//此处的destination=”com.yeeach.HelloWorldService”与remoting- config.xml中的id=”com.yeeach.HelloWorldService”完全匹配

//id=”helloWorldService”用来在actionscript中标识destination=”com.yeeach.HelloWorldService”,后面的helloWorldService.hello(inputVar)等都使用此id;

<mx:method name=”hello”
result=”sayHelloResult(event)”/>

//mx:method 声明java类com.yeeah.com.HelloWorldService中的hello方法及响应结果回调函数sayHelloResult
<mx:method name=”world”
result=”sayWorldResult(event)”/>
</mx:RemoteObject>
<mx:HBox>
<mx:Label text=”输入:”/>
<mx:TextInput id=”inputStr”/>
<mx:Button label=”say hello”
click=”sayHello(event);”/>
<mx:Button label=”say world”
click=”sayWorld(event);”/>
</mx:HBox>
<mx:HBox>
<mx:Label text=”结果:”/>
<mx:TextArea id=”result”/>
</mx:HBox>

<mx:Script>

<![CDATA[
import mx.rpc.events.FaultEvent;
import mx.controls.Alert;
import mx.rpc.events.ResultEvent;

function sayHello(event:Event):void
{
var inputVar:String=inputStr.text;
helloWorldService.hello(inputVar);

}

function sayWorld(event:Event):void
{
var inputVar:String=inputStr.text;
helloWorldService.world(inputVar);

}

private function sayHelloResult(event:ResultEvent):void
{
result.text=event.result.toString();
Alert.show(event.result.toString(), "返回结果");
}

private function sayWorldResult(event:ResultEvent):void
{
result.text=event.result.toString();
Alert.show(event.result.toString(), "返回结果");
}
]]>
</mx:Script>
</mx:Application>

代码文件:helloworld.rar

====http://www.jexchen.com/?p=87

Flex+BlazeDS+Java初步:环境配置与“Hello,World”

12月 30th, 2008 Posted in BlazeDS, Flex3, LCDS, RIA

好久没更新文章了,问题多多的2008就要过去了,希望来年是个好兆头,大家都平平安安…

其实很早就接触过Flex BlazeDS Java结合使用,最初还用的是FDS(Flex Data Service,早已更名为LiveCycle Data Service),不过从来没实际在项目中用过,由于现在的做的产品主要就是在这个架构上运行,因此有必要重新学习学习。

Flex+LCDS(BlazeDS)+Java这种方式对大型的企业级相关应用是比较好的选择。

网上关于Flex + BlazeDS + Java的安装配置文章很多,大都是按照官方的方式,使用向导的方式来进行的,而且通常使用的是BlazeDS Turkey(集成了Tomcat的BlazeDS版本),而且使用了WTP(Web Tools Platform的简称,允许开发人员在Eclipse下开J2EE Web应用),虽然配置比较简单,但由于采用向导的方式,实际上并不灵活,通过实践,推荐下面一种比较灵活的方式 ^_^我会将我在安装配置的过程遇到的常见问题一并指出,我自己做个记录,大家也可少走点弯路

我用的软件环境:

JDK 1.6

Eclipse 3.4.1

Flex 3 plugin for Eclipse (升级到Flex 3.0.214193,Flex SDK为3.2)

Sysdeo Eclipse Tomcat Launcher plugin (一款Eclipse下的Tocamt插件)

Tomcat6.0.13 (我用的是zip包,直接解压就用)

BlazeDS (我下载的是 blazeds-bin-3.2.0.3978.zip)

其中Tomcat的插件下载地址为:http://www.eclipsetotale.com/tomcatPlugin.html#A1 其它的相关软件大家应该都知道。

安装:

上面的所有工具安装都很简单,注意安装后请配置好JDK与Tomcat的环境变量,BlazeDS这里不需安装,下面讲 Hello World再说怎么使用。

Tomcat Launcher plugin插件安装好后,在eclipse中配置如下:

2008-12-30_150727

然后一步一步来创建Hello World:

先看一下完成后的项目结构图:

2008-12-30_171420

一、创建Java项目:

选择new->Java Project创建一个普通Java项目,其中注意的是为了与flex源文件目录区分,将java项目的源文件目录自定义为javasrc,并设定java class默认的输出目录,如下图:

2008-12-30_153522

(创建完成后可将本身的src目录删掉)

创建一简单的HelloWorldService类,用来当Flex端通过BlazeDS以RemoteObject的方式直接访问,SimpleService.java内容很简单,如下:

 

   1: package com.jexchen.blazeds;
   2:
   3: public class HelloWorldService {
   4:     public String sayHello(String str) {
   5:         return “Hello, “ + str;
   6:     }
   7: }

 

将blazeds-bin-3.2.0.3978.zip解压,得到flex.war, war其实就是一打包文件,使用解压软件将其解压,得到META-INF与WEB-INF两个目录,将WEB-INF目录下的flex、lib目录及web.xml文件复制到当前应用程序的WEB-INF目录下,在HelloBlazeDS项目上点右键,刷新,这时eclipse中HelloBlazeDS项目目录结构如下图所示:

2008-12-30_154523

二、为当前Java项目增添Flex Project支持

在HelloBlazeDS项目上点击右键,选Flex Project Nature –> Add Flex Project Nature如下图:

2008-12-30_155726

不选任何服务器支持,呆会手动配置:

2008-12-30_160010

指定Flex的编译生成目录至WEB-INF\flex,其中flex目录为新创建的:

2008-12-30_160036

按提示,切换到Flex视图,这时会报一个错误

2008-12-30_160413

在错误提示信息上点击右键,选择Recreate HTML Templates,为生成的swf重建HTML模板。

三、增添Tomcat服务器支持

在HelloBlazeDS项目上点击右键,选择Properties,打开的配置面板中选择Tomcat,设置参数如下:

2008-12-30_160950

完成设置。

(你会发现在我的d:\tomcat6.0.13\conf\Catalina\localhost\目录下生成了名为hello.xml的文件,生成该文件的目的就是为HelloBlazeDS项目在Tomcat下配置了一个独立的Context,这样就不必将文件布署到Tomcat的webapps下去了。

四、完成BlazeDS配置并创建Flex客户端程序

编辑WEB-INF\flex\remoting-config.xml文件,增添下面的语句:

 

   1: <destination id=”helloservice”>
   2:     <properties>
   3:         <source>com.jexchen.blazeds.HelloWorldService</source>
   4:     </properties>
   5: </destination>

 

在src下创建Flex应用程序HelloBlazeDS.mxml (MXML Application类型),代码如下:

 

   1: <?xml version=”1.0″ encoding=”utf-8″?>
   2: <mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”vertical”>
   3: <mx:Script>
   4:     <![CDATA[
   5:         import mx.controls.Alert;
   6:         private function onCall():void {
   7:
   8:             myService.sayHello(nameInput.text);
   9:         }
  10:     ]]>
  11: </mx:Script>
  12: <mx:RemoteObject id=”myService” destination=”helloservice” endpoint=”http://localhost:8080/hello/messagebroker/amf” />
  13:     <mx:TextInput id=”nameInput” />
  14:     <mx:Button label=”Call” click=”onCall()”/>
  15:
  16:     <mx:TextArea text=”{myService.sayHello.lastResult}” />
  17: </mx:Application>

 

需要注意的是Flex compiler的参数设置,我们这种完全手动配置的情况尤其需要注意,下面是我的参数配置,具体含义请查看相关资料:)

-context-root “webRoot” -services “e:/workspace/javaeeworkspace/HelloBlazeDS/webRoot/WEB-INF/flex/services-config.xml” -locale en_US

ok,现在可以点击工具栏上的小猫图标,启动Tomcat了,在浏览器输入以下地址:

http://localhost:8080/hello/flex/HelloBlazeDS.html

运行运行~~~效果如下:

2008-12-30_164501


 

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

使用BlazeDS实现Java和Flex通信

使用BlazeDS实现Java和Flex通信 Posted on 2010-01-13 17:22 疯狂 阅读(4528) 评论(0)  编辑  收藏 所属分类: flex  world 转...

使用Java中的JNI技术将C/C++程序嵌入到Java代码中实现Hello World

JNI技术简介JNI是Java Native Interface的缩写,它提供了若干的API实现了Java和其他语言的通信(主要是C&C++)。从Java1.1开始,JNI标准成为java平台的一部分...

Flex如何使用Blazeds与JAVA通信

上一次,我讲了如何新建一个包含Blazeds组件的工程(http://www.lightria.cn/index.php/archives/flexruheshiyongblazedsyujavato...

RabbitMQ Tutorials - Java版-01-"Hello World!"实现

英文原文网址:http://www.rabbitmq.com/getstarted.html 翻译 by 刘岳峰 前提 本教程要求已安装RabbitMQ,并且运行在localhost的标准端口...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)