由于图片太多,这里只提供无图片版本,完整版本可到该链接下载。
前段时间在学习Flex与Java的交互,在网上搜索开发环境配置教程的时候,发现网上的很多教程都讲得不够详细,而且模糊,更加郁闷的是,搜来搜去就那几篇,其他到处都是粘贴的复制品。这让我当时倍感痛苦。
好了,废话不多说,以上就是我写这篇文章的原因。现在进入主题。
一、 所需的工具
l Eclipse 3.4.2 (绿色版)
l blazeds_turnkey_3-0-0-544:turnkey版带有tomcat服务器,无需自己安装服务器
l 当然,安装上面工具之前,还得先安装JDK,JDK的安装和环境变量的配置参见其他说明。
二、 安装
l Flex Builder 3.0 SDK:直接双击安装即可,路径随便选,我的所选路径是:D:\Program Files\Adobe\Flex Builder 3
l Eclipse:将下载的文件直接解压到任意路径,我是解压放在D盘,路径是:D:\eclipse
l blazeds_turnkey:将下载下来的blazeds_turnkey压缩包解压放在D盘根目录下,如路径为:D:\blazeds
三、 新建工程前对Tomcat服务器的预备配置
如果之前在本机中安装了Tomcat服务器,blazeds_turnkey中自带的tomcat的相关启动配置之类的参数会指向已经安装的tomcat服务器的相关目录,所以我们需要对blazeds_turnkey中的tomcat进行重新配置。如果之前没有安装tomcat服务器的话,就无需要再重新配置。
进入D:\blazeds\tomcat\bin,双击打开tomcat6w.exe,按下面图片所示的进行参数配置:
在General选项栏中:
在Log On 选项栏按照默认,在Logging选项栏中:
在Java选项栏中:(其中需要将Java Options中变量的路径改为相应的现在blazeds_turnkey中的tomcat的路径)
在Startup选项栏:
在Shutdown选项栏:
四、 新建工程开发中的相关配置
下面以一个简单的Hello工程为例子来说明相关的参数配置。
进入路径D:\blazeds\tomcat\webapps,在该目录下新建一个名称为Hello的文件夹,该文件夹就是我们存放工程的地方。Webapps是Tomcat服务器发布应用程序的地方。
将D:\blazeds根目录下的blazeds.war文件的后缀名改为.rar,然后解压出META-INF文件夹和WEB-INF文件夹,并将这两个文件夹复制到上面刚刚新建的Hello文件夹的目录下,其中WEB-INF是存放服务器端相关文件的文件夹。
打开Flex Builder,新建工程Hello,相关配置如下所示:
点击Next按钮,进入下一步配置,相关配置如下所示:
填写完Server location 的信息之后,需要点击Validate Configuration按钮 进行路径时候有效的验证。如果在之前没有将META-INF文件夹和WEB-INF文件夹这两个文件夹拷贝到Hello目录下的话,会出现如下所示的错误:
点击Next按钮进入下面的配置,如下图所示:
最后按Finish按钮完成客户端开发的配置。
接下来对服务器端的开发进行配置。
打开Eclipse SDK,新建名称为Hello的Java project工程,Contents信息框需要选择Create project from exiting source,然后在Directory中选择一下路径:D:\blazeds\tomcat\webapps\Hello\WEB-INF,如下图所示:
点击Next按钮进入下一页配置,需要下面的Default output folder选项的路径改为Hello/classes,点击Browse按钮可进行选择,如下图所示,选择classes文件即可。其他无需配置,直接点击Finish完成。
新建好Hello项目的服务器端工程之后,在Eclipse 中,展开Hello工程,将src文件设为源文件,操作如下:右击src文件,选择New,然后选择Source Folder,在出现的对话框中,在Folder name输入框中,单击Browse按钮,再在出现的对话框中选择src文件,点击ok即可。配置好如下图所示:
按Finish按钮,完成。
接下来,右击src文件,选择New -> Package新建一个包,名字为flex.hello。再右击该新建的包flex.hello。选择New -> Class 新建一个类,命名为Hello,如下所示:
完成上面的步骤之后,Hello工程的展开如下图所示:
现在写源代码。在新建的类Hello中,输入以下代码:
package flex.hello;
public class Hello {
public String sayHello(String str){
System.out.println("Hello "+ str);
return "Hello " + str;
}
}
完成之后,点击flex文件,展开目录,双击打开remoting-config.xml配置文件,在<service></service>根标签里面添加下面的代码:
<destination id="hello">
<properties>
<source> flex.hello.Hello</source>
</properties>
</destination>
完成对remoting-config.xml文件的配置之后,我们还需要对services-config.xml文件进行配置。双击打开该文件,在<services></services>标签里面添加以下代码:
<default-channels>
<channel ref="my-amf"/>
</default-channels>
完成后如下图所示:
好了!!!好现在为止,我们已经完成了对服务器端开发的配置了。接下来我们要完成客户端的代码以及相关的配置。
在Flex Builder中展开Hello工程的目录,双击打开Hello.mxml文件,输入以下代码后保存:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
imp
imp
[Bindable]
private var helloResult:String;
private function sayHello():void{
ho.sayHello(inputText.text);
}
private function resultHandler(event:ResultEvent):void{
helloResult = event.result as String;
}
]]>
</mx:Script>
<mx:RemoteObject id="ho" destination="hello" result="resultHandler(event)" />
<mx:Label text="{helloResult}" fontSize="12" x="166.5" y="170" width="181" height="58" textAlign="center" fontWeight="bold"/>
<mx:TextInput x="22" y="49" width="250" height="46" id="inputText" fontWeight="bold" fontSize="12"/>
<mx:Button x="297.5" y="49" label="发送" width="88" height="46" fontSize="12" click="sayHello()"/>
</mx:Application>
进入D:\blazeds\tomcat\bin,双击打开tomcat6.exe,启动tomcat服务器。如果之前已经启动了tomcat服务器,需要先停止tomcat服务器,再重新启动。停止和重新启动tomcat服务器,双击打开tomcat6w.exe进行操作即可。
到这里,我们的配置就算是已经完成了。
在Flex Builder中运行Hello.mxml,出现以下界面:
在输入框中数据任何字符,点击发送按钮之后,该客户端程度都将会通过与服务器端的交互,在经过服务器端程序的处理,而返回如“Hello …”之类的提示。比如我们在输入框中输入kaka,点击发送按钮之后,将会接收到Hello kaka。如下图所示:
大功告成!
评论