通过BlazeDS实现flex和服务器的交互

可以认为BlazeDS是Livecycle Data Services的精简版本和免费版本(BlazeDS与Livecycle Data Services的区别)。可用于提供服务器和FLEX客户端程序的通信支持。比如这个例子使用flex DataGrid组件中只是将flex中的数组绑定和显示到列表中。实际开发中这些数组往往来源于服务器。

users

这是下面实现示例的界面,数据来源于tomcat服务器端。

下载和安装BlazeDS

Flex Builder本身不提供BlazeDS,需要下载和安装。下载BlazeDS:

http://opensource.adobe.com/wiki/display/blazeds/BlazeDS

安装很简单,解压缩即可。里面有一个blazeds.war文件,就是要用的文件。让java web项目支持和安装BlazeDS,其实就是将这个war文件中WEB-INF目录下的文件复制到自己项目中。

注意一下war文件中的web.xml文件,和servlet的集成机制就可以知道个大概。BlazeDS提供了一个SessionListener处理客户端flex程序和Servlet session之间的交互。还提供了MessageBrokerServlet,用于处理flex和web服务器之间的通信处理。

创建集成BlazeDS的FLEX Builder项目

创建flex项目,需要勾选下面条目:

ds.1

然后,选择刚才解压缩blazeds.war文件路径:

 ds.2

其他的没什么了,创建后的目录结构:

 ds.3

编写简单的交互程序

这里演示使用HttpService从flex客户端发起GET请求,服务器端返回一个xml格式数据(这里做演示是一个静态的xml文件,可以通过Servlet动态生成):

 

<?xml version="1.0" encoding="UTF-8"?> <users> <user> <name>张三</name> <birthday>1999-1-1</birthday> <job>程序员</job> </user> <user> <name>李四</name> <birthday>2000-1-1</birthday> <job>公务员</job> </user> <user> <name>王五</name> <birthday>1988-2-11</birthday> <job>销售</job> </user> </users>

编写的flex代码:

 

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" initialize="init()"> <mx:Script> <![CDATA[ import mx.utils.ObjectProxy; import mx.collections.XMLListCollection; import mx.collections.ArrayCollection; import mx.rpc.events.ResultEvent; import mx.controls.Alert; [Bindable] private var userResults:ArrayCollection; private function init():void{ getUsers.send(); } private function getResults(event:ResultEvent):void{ if(this.getUsers.lastResult.users.user is ObjectProxy){ userResults=new ArrayCollection(); userResults.addItem(event.result.users.user); }else{ userResults=event.result.users.user as ArrayCollection; } } ]]> </mx:Script> <mx:HTTPService id="getUsers" url="users.xml" method="GET" result="getResults(event)" /> <mx:Panel x="10" y="10" width="431" height="139" layout="absolute" title="用户列表" fontSize="12"> <mx:DataGrid id="myGrid" x="10" y="10" width="391" height="82" editable="true" dataProvider="{userResults}"> <mx:columns> <mx:DataGridColumn headerText="姓名" dataField="name"/> <mx:DataGridColumn headerText="生日" dataField="birthday"/> <mx:DataGridColumn headerText="职业" dataField="job"/> </mx:columns> </mx:DataGrid> </mx:Panel> </mx:Application>

这里需要注意的是,xml响应内容,可以被flex通过不同策略解析。在这里是通过默认的object方式。当仅有一个user节点的时候,自动转型为对象而不是数组,多个user节点的时候才转型为数组。所以处理逻辑稍显麻烦。

flex的自动绑定功能和对应的元数据支持,使flex内部的模型、视图和控制代码十分清楚简明。

如何自动编译MXML文件

BlazeDS比LCDS少提供一个动态编译mxml的功能。比如mxml复制到webcontent目录下,lcds可以让用户访问test.mxml时,自动编译,并输出swf。

使用BlazeDS,可以这样设置,由flex builder编译mxml文件输出swf文件到webcontent目录下。这样显然不如lcds动态,如果是正式项目,可以通过maven和相关插件构建时编译。

配置flex builder编译mxml文件输出swf文件到webcontent目录:

flex11

PDF格式打印機    发送文章为PDF   

这篇文章上的评论的 RSS feed TrackBack URI

Leave a Reply