<!-- Feedsky FEED发布代码开始 -->
欢迎点击此处订阅本Blog
<!-- FEED自动发现标记开始 --> <link title="RSS 2.0" type="application/rss+xml" href="http://feed.feedsky.com/softwave" rel="alternate"> <!-- FEED自动发现标记结束 -->
<!--Google 468*60横幅广告开始--><script type="text/javascript"><!-- google_ad_client = "pub-7343546549496470"; google_ad_width = 468; google_ad_height = 60; google_ad_format = "468x60_as"; google_ad_type = "image"; //2007-07-26: CSDN google_ad_channel = "6063905817"; google_color_border = "6699CC"; google_color_bg = "E6E6E6"; google_color_link = "FFFFFF"; google_color_text = "333333"; google_color_url = "AECCEB"; google_ui_features = "rc:6"; //--> </script><script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script><!--Google 468*60横幅广告结束-->
Flex + LCDS + Java
入门教程
1.
Flex
是什么?
……
2.
LCDS
是什么?
LCDS
(
LiveCycle Data Service
)之前叫做
FDS
(
Flex Data Service
),他是基于
java
(也有
ColdFusion
版的)后端的数据服务工程,功能包括映射
Java
对象到
Flex
对象(包括调用
Java
类的方法)、
RTMP
(
Real Time Message Protocol
)、代理、服务端生成
PDF
等等功能,详细请参考
LCDS
里的说明。官方有下载,需要注册会员(免费)。
LCDS
实际是付费的,但是免费也能使用,似乎是少了多
CPU
的支持。当然还有一些其他的数据服务,比如
AMFPHP
之类的。
当然,
LCDS
提供的功能我们都能自己实现,并非
Flex
脱离了
LCDS
就不能和后台打交道了,除了
RemoteObject
还有
WebSerivce
、
HTTPService
等等。只是说,
LCDS
提供了更多的方便和特性。
3.
Java
是什么?
……(此处省略1W字)
三.准备
1.
下载开发环境:
Eclipse 3.3 + FlexBuilder3 beta2
插件版
+MyEclipse 6.0 +Lcds + Tomcat 5
和以上(官方都有下载,或者
google
里搜一搜哈)
MyEclipse
:做
Java
开发都应该知道
MyEclipse
是比较好的
J2EE
项目的开发及部署工具的,我们主要用它来部署
Flex
和
Java
结合的项目。
6.0
是适合
Eclipse3.3
版的。他自带了一个
Tomcat
服务器
FB3
:相比
FB2
,他在
LCDS
工程上做了很大的改进,特别是
beta2
,项目向导更加的易懂,而且比
FB2
更好的是,
Flex.war
是被打包在你的
Flex
项目中的,而不需要单独的部署了。性能上也高出
FB2
LCDS
:安装
lcds
后,起作用的是里面的
flex.war
文件,实际上,这就是一个
j2ee
的工程。在发布到
web
应用服务器后(比如
tomcat
、
j4run
等)就会被解压成一个工程。当然,在
FB3
里,这个发布的过程会更加的简单。
2.
安装:
略
四.入门教程
1.
新建
FlexLCDS
工程
File -> new -> Flex Project …
注:以下设置绝大多数都可以在项目属性中可以修改。
1).
向导界面
1
<oval id="_x0000_s1039" style="margin-top: 310.2pt; z-index: 14; left: 0px; margin-left: 120.6pt; width: 63pt; position: absolute; height: 39pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shapetype id="_x0000_t75" filled="f" stroked="f" path="m@4@5l@4@11@9@11@9@5xe" o:preferrelative="t" o:spt="75" coordsize="21600,21600"><stroke joinstyle="miter"></stroke><formulas><f eqn="if lineDrawn pixelLineWidth 0"></f><f eqn="sum @0 1 0"></f><f eqn="sum 0 0 @1"></f><f eqn="prod @2 1 2"></f><f eqn="prod @3 21600 pixelWidth"></f><f eqn="prod @3 21600 pixelHeight"></f><f eqn="sum @0 0 1"></f><f eqn="prod @6 1 2"></f><f eqn="prod @7 21600 pixelWidth"></f><f eqn="sum @8 21600 0"></f><f eqn="prod @7 21600 pixelHeight"></f><f eqn="sum @10 21600 0"></f></formulas><path o:connecttype="rect" gradientshapeok="t" o:extrusionok="f"></path><lock aspectratio="t" v:ext="edit"></lock></shapetype><shape id="_x0000_i1025" style="width: 462pt; height: 414.75pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image002.png"></imagedata></shape>
说明:
Java source folder
就是你自己
java
业务源码存放的根目录,在
FB3
里,
LCDS
项目旨在将
Java J2ee
项目和
FlexLcds
项目混合。
当然如果你不选择
combined
两个在一起,那么就麻烦些:要么你再单独新建一个
Flex
项目,而这个项目只写
java
代码。要么再建一个
J2ee
工程写
java
代码,而这个项目只写
Flex
代码,但最后要把
Java
编译后的
class
文件放到这个项目下的
webroot/web-inf/classes
目录中。即不管怎样,最后发布时,
java
编译后的
class
文件必须和
lcds
部署的项目在一起。(听起来绕昏头了?那就在一个工程里吧)
2).
向导界面
2
<oval id="_x0000_s1042" style="margin-top: 156.75pt; z-index: 17; left: 0px; margin-left: 112.8pt; width: 70.8pt; position: absolute; height: 23.4pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval><oval id="_x0000_s1029" style="margin-top: 132.6pt; z-index: 4; left: 0px; margin-left: 108pt; width: 63pt; position: absolute; height: 23.4pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval><oval id="_x0000_s1026" style="margin-top: 263.4pt; z-index: 1; left: 0px; margin-left: 111.6pt; width: 63pt; position: absolute; height: 39pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval><oval id="_x0000_s1027" style="margin-top: 84pt; z-index: 2; left: 0px; margin-left: 426.6pt; width: 63pt; position: absolute; height: 39pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1026" style="width: 462.75pt; height: 414.75pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image008.png"></imagedata></shape>
说明:
Target runtime
实际上没什么用(后来我删除了配置文件里的对应信息,也没问题),但是不指定就不能继续,如果这里显示的是
<none>
那么就新建一个
Tomcat
的
runtime
,简单的只需要指定
tomcat
的安装目录即可。
Content folder
实际上就是最终编译后的容器目录,因此,
Lcds
的
flex.war
文件将会发布到
该目录
下的
web-inf
下的
flex
目录中。同时因为教程采用的是
MyEclipse
,他默认的就是发布
WebRoot
里的内容,为了自动化,因此这里改为了
WebRoot
(这也是
java
开发的习惯)
Flex WAR file
指的是安装了
lcds
后的
flex.war
文件的路径
Compilation options
指定了
flex
文件的编译方式,选择推荐的在
FlexBuilder
里编译吧,虽然开发时多耗点时间,但是在发布后不会占用服务器的编译处理时间,对用户来说是有好处的。
Output folder
指的是
Flex
编译后的
swf
和
html
等文件存放的路径,这里改为了
WebRoot/bin
3).
向导界面
3
<oval id="_x0000_s1028" style="margin-top: 396pt; z-index: 3; left: 0px; margin-left: 111.6pt; width: 180pt; position: absolute; height: 39pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1027" style="width: 463.5pt; height: 497.25pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image011.png"></imagedata></shape>
说明:
Main source folder
是
flex
的源码存放根目录,当然和
java
源码分开了。
Output folder URL
是在开发过程中运行和调试的请求路径,这个与发布无关,不会影响任何你在程序中使用的路径,但是能使开发方便
注意:
FlexBuilder3
这里存在
bug
,新建工程时,部分自定义的属性并没有保存下来,而必须在新建后的项目属性中更改,后面有说明到
放心这些设置都可以在以后修改。
4).
新建完成的项目结构看起来是这样的
<shape id="_x0000_i1028" style="width: 145.5pt; height: 167.25pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image013.png"></imagedata></shape>
2.
用
MyEclipse
添加
Web
容器
之前说到了,
MyEclipse
是很好用的
J2EE
的开发插件,其中就包含了部署功能。我们可以抛开烦琐的手动部署,交由
MyEclipse
完成吧,当然,首先得让你的
FlexLCDS
工程变成为
J2EE
的
Web
工程。
<shape id="_x0000_i1029" style="width: 348.75pt; height: 459pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image015.png"></imagedata></shape>
1).
向导界面
1
<oval id="_x0000_s1031" style="margin-top: 114.15pt; z-index: 6; left: 0px; margin-left: 154.05pt; width: 27pt; position: absolute; height: 23.4pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1030" style="width: 344.25pt; height: 303.75pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image018.png"></imagedata></shape>
注意:不要点快了,把这里的
Create web.xml
取消,这样就不会覆盖
LCDS
创建的
web.xml
文件
现在我们的工程的图标变成了
J2EE Web
工程了,这意味着,你可以用
MyEclipse
来发布它或者添加更多容器,比如
hibernate
、
spring
等
<shape id="_x0000_i1031" style="width: 95.25pt; height: 17.25pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image020.png"></imagedata></shape>
3.
部署
FlexLCDS
工程
有了
MyEclipse
,那么你就不用手动的部署你的项目了,可以简单的通过
点击工具栏上的这个图标
<oval id="_x0000_s1030" style="margin-top: 0px; z-index: 5; left: 0px; margin-left: 63pt; width: 36pt; position: absolute; height: 31.2pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1032" style="width: 138pt; height: 24.75pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image023.png"></imagedata></shape>
1).
部署向导
1
<oval id="_x0000_s1032" style="margin-top: 109.2pt; z-index: 7; left: 0px; margin-left: 342pt; width: 1in; position: absolute; height: 31.2pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1033" style="width: 378.75pt; height: 327.75pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image026.png"></imagedata></shape>
注意:(如果你的列表中没有服务器,那么就自己建一个)
2).
新建部署
Web
应用服务器
<oval id="_x0000_s1033" style="margin-top: 85.8pt; z-index: 8; left: 0px; margin-left: 90pt; width: 351pt; position: absolute; height: 31.2pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1034" style="width: 394.5pt; height: 396.75pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image029.png"></imagedata></shape>
注意:如果是
MyEclipse6.0
,则会自带一个
Tomcat
服务器。如果不是
6.0
,那么点
Edit server connectors…
自己添加一个
tomcat
。
点
finish
后则会开始部署。成功后会在
Deployment status
里提示
success
,并且看到列表中你的项目已经成功部署
4.
修改一下项目的访问路径
打开项目的属性,在这里,我们可以重新修改项目编译和发布的配置,包括先前向导里的设置
<shape id="_x0000_i1035" style="width: 189pt; height: 390.75pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image031.png"></imagedata></shape>
修改
output folder url
<oval id="_x0000_s1034" style="margin-top: 364.8pt; z-index: 9; left: 0px; margin-left: 255.6pt; width: 162pt; position: absolute; height: 62.4pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval><oval id="_x0000_s1035" style="margin-top: 84pt; z-index: 10; left: 0px; margin-left: 30.6pt; width: 99pt; position: absolute; height: 39pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1036" style="width: 474pt; height: 455.25pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image035.png"></imagedata></shape>
为什么要这么做?
这样每次发布都会自动将编译的最终
swf
文件直接发布至
WebRoot/bin
目录下,而下面的
output folder url
则会在我们启动和调试项目时,直接请求这个路径(这跟发布无关,只是我们在开发过程中会方便些)
5.
修改
Flex Server
的项目容器属性(非常重要,多数连接路径错误就是这里配置错误)
改成如下配置
<oval id="_x0000_s1038" style="margin-top: 70.2pt; z-index: 13; left: 0px; margin-left: 198pt; width: 162pt; position: absolute; height: 62.4pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1037" style="width: 456.75pt; height: 277.5pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image038.png"></imagedata></shape>
说明:
Root url
当然就是你的
web
服务器的根路径了,
Tomcat
默认是
8080
端口,如果改了就自己修改
Context root
就是
LCDS
工程的名称(注意:如果你分开为两个工程,则这里指的是你
J2ee
项目的名称,而不是你
Flex
项目的名称,因为你在请求
Java
的数据服务),在
Flex
请求
LCDS
时,会采用这个作为参数
http://{server.name}:{server.port}/{context.root}/messagebroker/amf
如果
Context root
错了,那么永远不可能正确的请求
LCDS
的服务了
。
确定后,我们来运行测试一下这个
FlexLCDS
项目是否能正常访问
6.
启动服务器
<oval id="_x0000_s1041" style="margin-top: 0px; z-index: 16; left: 0px; margin-left: 90pt; width: 36pt; position: absolute; height: 31.2pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1038" style="width: 138pt; height: 24.75pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image023.png"></imagedata></shape>
稍等片刻,等到服务器完全启动后继续下面的操作
7.
运行访问
<shape id="_x0000_i1039" style="width: 294.75pt; height: 356.25pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image040.png"></imagedata></shape>
注:如果之前的
Output folder url
配置正确,那么会自动的弹出访问页面,
DEBUG
时也是一样。
<oval id="_x0000_s1040" style="margin-top: 6pt; z-index: 15; left: 0px; margin-left: 129.6pt; width: 315pt; position: absolute; height: 54.6pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1040" style="width: 413.25pt; height: 120pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image043.png"></imagedata></shape>
OK
,一切顺利,至此,你已经做到了第一步,即,将
Flex
项目、
LCDS
服务成功的整合至
J2EE web
项目,这样的好处就是今后发布省的麻烦了。
五.简单的
RemoteObject
1.
什么是
RemoteObject
?
顾名思义,即远程对象。这里指的就是在
Flex
中获取
Java
里的对象。有什么用呢?这样
Flex
可以更加简单的获取服务端的数据,比如你在
Java
中有个方法进行了数据查询,取出的结果是
Array
类型,那么你可以很容易通过
Flex
里的
RemoteObject
访问到该类,并调用该方法,最后返回的数据是
Flex
也兼容的
Array
对象。
2.
新建
Java
类
File -> new ->other
(如果你没在列表中看到
java class
的话)
1).
新建向导
1
<shape id="_x0000_i1041" style="width: 369pt; height: 371.25pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image045.png"></imagedata></shape>
2).
向导
2
<oval id="_x0000_s1036" style="margin-top: 70.2pt; z-index: 11; left: 0px; margin-left: 108pt; width: 108pt; position: absolute; height: 31.2pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1042" style="width: 372pt; height: 442.5pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image048.png"></imagedata></shape>
注意:别忘记了你设定的
java
源码根目录路径,如果对
java
不熟悉的话,这里我就不解释了,照着做吧。
3).
编写如下代码
package
com.test;
public
class
FirstJavaClass {
public
String sayHello(String str){
return
"
你说的是:
"
+str;
}
}
3.
配置
Flex LCDS
的
Remoting-config.xml
1).
他是
remoteobject
和相关远程访问的配置文件,路径位于
<oval id="_x0000_s1037" style="margin-top: 296.4pt; z-index: 12; left: 0px; margin-left: 99pt; width: 108pt; position: absolute; height: 23.4pt; text-align: left;" strokeweight="2.25pt" strokecolor="red" filled="f"></oval>
<shape id="_x0000_i1043" style="width: 189pt; height: 331.5pt;" type="#_x0000_t75"><imagedata o:title="" src="file:///C:%5CDOCUME%7E1%5CADMINI%7E1%5CLOCALS%7E1%5CTemp%5Cmsohtml1%5C01%5Cclip_image051.png"></imagedata></shape>
注意:现在
LCDS
是你的项目的一部分了,因此不用来回的在服务器中修改配置然后再发布了。
2).
改写其代码如下
<?
xml
version
=
"1.0"
encoding
=
"UTF-8"
?>
<
service
id
=
"remoting-service"
class
=
"flex.messaging.services.RemotingService"
>
<
adapters
>
<
adapter-definition
id
=
"java-object"
class
=
"flex.messaging.services.remoting.adapters.JavaAdapter"
default
=
"true"
/>
</
adapters
>
<
default-channels
>
<
channel
ref
=
"my-amf"
/>
</
default-channels
>
<
destination
id
=
"FirstJavaClassRemoteObject"
>
<
properties
>
<
source
>
com.test.FirstJavaClass
</
source
>
<
scope
>
application
</
scope
>
</
properties
>
</
destination
>
</
service
>
说明:一个
destination
指定的就是一个
RO
对象,他的
id
就是在
Flex
中
RO
请求的
destination
,
source
指的是这个
Java
类的路径
注意:在修改了配置文件后可能需要重启
web
服务器(
Tomcat
)
4.
编写
mxml
来请求
RO
1).
打开
MyFirstLCDS.mxml
编写代码如下
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="
http://www.adobe.com/2006/mxml
" layout="
absolute
"
>
<mx:Script>
<![CDATA[
import
mx.rpc.events.ResultEvent;
import
mx.controls.Alert;
private
function
callRO(str:String):
void
{
firstRO.sayHello(str);
firstRO.addEventListener(ResultEvent.RESULT,getROResult);
}
private
function
getROResult(e:ResultEvent) :
void
{
Alert.show(e.result.toString());
}
]]>
</mx:Script>
<mx:RemoteObject
id="
firstRO
" destination="
FirstJavaClassRemoteObject
"
/>
<mx:Button
click="callRO(
'hi~
你好
'
)" label="
请求
"
/>
</mx:Application>
2)
.
OK
,
<!--新Google 468*60横幅广告开始--><script type="text/javascript"><!-- google_ad_client = "pub-7343546549496470"; /* 468x60, 创建于 08-8-6 */ google_ad_slot = "7368701459"; google_ad_width = 468; google_ad_height = 60; //--> </script><script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script><!--新Google 468*60横幅广告结束-->
<!--新Google 468x15 横链接单元开始--><script type="text/javascript"><!-- google_ad_client = "pub-7343546549496470"; /* 468x15 横链接单元 */ google_ad_slot = "5785741422"; google_ad_width = 468; google_ad_height = 15; //--> </script><script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script><!--新Google 468x15 横链接单元结束-->
<!-- Google Reader shared发布代码开始 --><script type="text/javascript" src="http://www.google.com/reader/ui/publisher.js"></script><script type="text/javascript" src="http://www.google.com/reader/public/javascript/user/00697638153916680411/state/com.google/broadcast?n=5&callback=GRC_p(%7Bc%3A%22green%22%2Ct%3A%22%5Cu8FD9%5Cu4E9B%5Cu6587%5Cu7AE0%5Cu4E5F%5Cu503C%5Cu5F97%5Cu4E00%5Cu770B%22%2Cs%3A%22false%22%7D)%3Bnew%20GRC"></script><!-- Google Reader shared发布代码结束 -->
Flex+LCDS+Java 入门教程