通过BlazeDS 开发J2EE+Flex项目

来源:互联网 发布:淘宝搜索产品流程 编辑:程序博客网 时间:2024/05/22 13:07

准备工作

安装配置系统软件和工具

JDK1.5或者以上版本

MyEclipse 7.0或者以上版本

Flex4 for eclipse plug-in

Tomcat5.0 或者以上版本

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

 

二、 环境搭建(集成BlazeDS)

新建一个JAVA WEB工程

新建一个JAVA WEB工程,名为flexweb 设置项目的编码方式为utf-8

BlazeDS集成FLEX和TOMCAT

1)解压BlazeDS.war%TOMCAT_HOME%/webapps目录下

2)为web app 添加blazeds 支持:

右击WebRoot选择import—>GeneralàFile system

 

单击Browse 选择tomoat服务器安装地址,然后选择webapps中的blazeds文件夹

 

单击确定,然后勾选它

单击Finish 然后选择Yse to all

新建一测试类

j2ee视图中创建一个package com.flex.test”,在包com.flex.test 下面创建一个类FlexWeb.这个类有一个简单的方法:text(String name)

打开 flexwebWebRoot/WEB-INF/flex/remoting-config.xml,添加一个供flex 客户端调用的destination. 复制下列代码到remoting-config.xml中

<destination id="Hello">

    <properties>

    <source>com.flex.test.FlexWeb</source>

    </properties>

    </destination>

 

保存项目,用tomcat发布启动tomcat

添加FLEX支持

在工程flexweb上右键 flex project nature->add flex project nature.(中文为添加/更改项目类型这时会弹出对话框

 

 

Root folder(根文件夹):选择刚才发布到tomcat的工程flexweb路径(%TOMCAT_HOME%/webapps目录下

Root URLTOMCAT服务器的启动路径加上flexweb,说明我们要启动到flexweb工程

Context root :编译后的FLEX项目路径

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

[点击Finish完成]

找到Problems窗口看到有一个错误然后我们右键选重新创建HTML模板。这里错误已经解决,但是新的问题又来了,srcjava的源文件夹存java源代码地方,但是现在被flex给占用了所以我们要重新给flex添加一个源文件目录,如下图

右键项目属性找到flex构键路径的主源文件夹把src改为flex_src

 

然后把src文件夹里面的flexweb.xml移动到flex_src文件夹里面

4、编辑FLEX应用程序

Flex应用程序,例如 flexweb.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.text(iname);

}

]]>

</mx:Script>

</mx:Application>

 

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

到这里代码已经完成,重新发布你的项目,重启tomcat,在项目中右击flexweb.mxml运行你会看到如下效果

0 0