BlazeDS集成 Flex+Tomcat开发J2EE模块整合实例

BlazeDS集成 Flex+Tomcat开发J2EE模块整合实例

一、             准备工作

l  安装配置系统软件和工具

JDK1.5或者以上版本

Eclipse3.2或者以上版本

Flex3 for eclipse plug-in

Tomcat5.0 或者以上版本

BlazeDS.war (blazeds是一个用于集成flex 客户端和j2ee server的组件)

（Eclipse 加装MyEclipse5.0以上版本插件，JDK,TOMCAT,Flex3 form eclipse plug-in安装方式我就不多说了）

 

二、             环境搭建(集成BlazeDS)

l  新建一个JAVA WEB工程

新建一个JAVA WEB工程，名为Demo

l  BlazeDS集成FLEX和TOMCAT

1）解压BlazeDS.war到%TOMCAT_HOME%/webapps目录下文件名为blazeds内包涵了WEB-INF和META－INF文件夹

2）为web app 添加blazeds 支持：

%TOMCAT_HOME%/webapps \WEB-INF\lib目录下面所有jar文件拷贝到 Demo 的webRoot/WEB-INF/lib 目录下.

将%TOMCAT_HOME%/webapps \WEB-INF\flex 目录拷贝到Demo的webContent/WEB-INF 下.

将%TOMCAT_HOME%/webapps \WEB-INF 下的web.xml 中的 <listener/> <servlet/> <servlet-mapping/>三个节点的内容 拷贝到Demo的 web.xml 中

至此,我们的Demo已经具备了blazeds 的功能.

 

三、             在Eclipse下开发FLEX

l  新建一测试类

在j2ee视图中创建一个package “com.wingo.samuel.ro”,在包com.wingo.samuel.ro 下面创建一个类HelloWorld.这个类有一个简单的方法:sayHelloTo(String name)

package com.wingo.samuel.ro;   public class HelloWorld {     public String sayHelloTo(String name){        return "Hello World"+name;     } }

打开 Demo的WebRoot/WEB-INF/flex/remoting-config.xml,添加一个供flex 客户端调用的destination.

<destination id="Hello">     <properties>     <source>com.wingo.samuel.ro.HelloWorld</source>     </properties>     </destination>

 

l  添加FLEX支持

在添加时先将Demo工程Deploy到TOMCAT,后面会用到其路径

在工程Demo 上右键 flex project nature->add flex project nature. 这时会弹出对话框

在Application server type选择J2EE,[点击NEXT]

Root folder：选择刚才Deploy的工程Demo路径

Root URL：TOMCAT服务器的启动路径加上Demo，说明我们要启动到Demo工程

Context root ：编译后的FLEX文件保存路径

Output folder：工程 重构后FLEX文件的输出路径

[点击Finish完成]

l  配置Flex 项目属性

在Flex视图下,右键 properties打开项目属性设置对话框.选择 “Flex Build Path”,出现以下对话框：

Output folder：工程FLEX文件的输出路径

Output folder URL：工程在TOMCAT服务器的启动路径

――――――――――――――――――――――――――

选择 “Flex Compiler”,出现以下对话框：

选择你当前用的FLEX SDK（如何你前面步骤配置好的话就不会出错了！）

[点击Apply应用]

―――――――――――――――――――――――――――――――――――

选择 “Flex Server”,出现以下对话框：

Context root：是你的工程的根目录

[点击OK完成设置]

4、编辑FLEX应用程序

在Flex应用程序,例如 Demo.mxml 中添加以下代码：

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">     <mx:RemoteObject id="say" destination="Hello">            </mx:RemoteObject>     <mx:Button x="335" y="80" label=" Click" click="remotingSayHello(event);"/>     <mx:TextInput x="159" y="80" id="tiName"/>     <mx:Label x="109" y="82" text="name:"/>     <mx:Label text="{say.sayHelloTo.lastResult}" x="44" y="162" width="448" height="71" id="lblView" color="#FCEE09" fontSize="20" fontWeight="bold" textDecoration="underline" fontStyle="normal"/>     <mx:Script>        <![CDATA[            function remotingSayHello(event:Event):void{               var iname:String=tiName.text;               say.sayHelloTo(iname);            }        ]]>     </mx:Script> </mx:Application>

 

在Flex Development视图下,project->Build Project,可以看到Flex 应用程序被正确编译,产生输出到bin目录下面

如果在问题窗口Problems中出现 can not create html-template`````则按照提示右键创建；然后再重新编译工程就不会出现问题了！

[启动TOMCAT输入http://localhost:8080/Demo/bin/Demo.html 你可以进行FLEX测试了！]

 

四、             FSAD