[转载]Flex 数据交互的三种方式 – 每一点知识的积累都是对生命的充实!!! – 博客园.
需要的工具:
Vs2008 or Vs2010
Adobe Flash Builder 4(Flex开发工具)
Flex本身并不支持直接与数据库交互,但可以通过间接的三种方式与数据库交互,下面分别介绍:
Webservice通讯
大家最能想到的就是调用webservice,其特性我就不一一例举, 总之webservice具有通用性,当然Flex也可以支持了.
首先简单的建立个web项目,添加一个web服务,最简单的定义一个方法,比如HelloWorld:
[WebMethod]
public string HelloWorld()
{
return "Hello World";
}
在Flex里面建立项目,并添加一个mxml文件…名字随便..
<fx:Declarations>
<s:WebService id="WS"
//webservice的地址
wsdl="http://localhost:3431/WebSite1/WebServiceFlex.asmx?wsdl"
//错误提示
fault="Alert.show(event.fault.faultString,'Error')" showBusyCursor="true">
//调用的webservice 里面的方法名称
<s:operation name="HelloWorld" resultFormat="object"
//回调函数
result="onResult(event);"></s:operation>
</s:WebService>
</fx:Declarations>
下面在Script标签里面写上Flex的回调函数onResult(event);
import mx.controls.Alert;
import mx.events.ResizeEvent;
import mx.rpc.events.ResultEvent;
internal function onResult(evt:ResultEvent):void
{
//返回结果
Alert.show(evt.result.toString());
}
在页面上放一个按钮来触发这个webservice
<mx:Button x=”26″ y=”209″ label=”获取webservice的信息” fontSize=”12″ click=”WS.HellowWorld.send()”/>
运行就可以看到效果了.\
HttpService通讯
<mx:HTTPService id=”menus” resultFormat=”xml” url=”dataAsset/rooms.xml” result=”httpservice1_resultHandler(event)”/>
resultFormat :
指示如何反序列化由 HTTP 调用返回的结果的值。该项目的值根据以下条件确定:
· 返回的是 XML 还是名称/值对。
· 访问结果的方式;可以将结果作为 object、text 或 XML 进行访问。
默认值为 object。允许使用的值包括:
· object 返回的值为 XML 并且按照 ActionScript 对象树分析。此为默认。
· array 返回的值是 XML 并且按照 ActionScript 对象树分析。但是,如果顶级对象不是数组,将创建一个新数组并且将结果设置为第一个项目。如果 makeObjectsBindable 为 true,则该数组将被包装在 ArrayCollection 中。
· xml 返回的值为 XML 并且作为 ActionScript XMLnode 对象中的文本 XML 返回。
· flashvars 返回的值是包含由 & 符号分隔的名称=值对的文本,该文本被分析为 ActionScript 对象。
· text 返回的值为文本并且未经处理。
· e4x 返回的值为 XML 并且作为 ActionScript XML 对象中的文本 XML 返回,可以使用 ECMAScript for XML (E4X) 表达式进行访问。
Result : 当 HTTPService 调用成功返回时分派。
Url: 服务的位置。如果指定 url 并指定非默认目标,则 services-config.xml 文件中的目标必须允许该指定的 URL。
httpservice1_resultHandler(event) 是返回结果调用的函数:
protected function httpservice1_resultHandler(event:ResultEvent):void
{
Var roomsXml=new XML(event.result);
menuInfo=roomsXml.node;
trace(menuInfo);
}
Httpservice比较简单.还有一个技巧是url可以指定一个aspx页面的连接地址, 在这个aspx 里面通过Respince.write() 输出一个xml 格式的字符串也可以达到这种效果.比较灵活。
利用Remoting 与数据库通讯
需要的组件
Remoting网关 : FluorineFx 一个第三方的组件 下载地址
当然还有 Vs2008
介绍
FluorineFX是一个开源库,提供了一种在.NET framework下对Flex/Flash的远程过程调用,Flex数据服务和实时数据的使用技术。
能被.NET frameworks支持的FluorineFx有:
Microsoft .NET Framework 1.1 (1.1.4322)
Microsoft .NET Framework 2.0 (2.0.50727)
Microsoft .NET Framework 3.5 (3.5.21022.8)
Microsoft .NET Framework 4.0
Mono 1.2.4
.NET frameworks 支持向下兼容,所以新版本的框架将运行的二进制集会被定位到先前版本的框架
Fluorine是一种开源的AMF(ActionScript Messaging Formatter)网关,专门负责Flex3.0与.Net交互时的数据类型转换。Fluorine现支持ActionScript 2.0和ActionScript 3.0,所以Fluorine也可作为Flash与.Net交互时的AMF网关。
安装
安装好FluorineFX 在Vs2008下新建项目,可以看到多了一个FluorineFX ServiceLibrary

OK,说明你的FluorineFX安装成功了.创建项目.

此图来源于网上..这个图是很形象滴..不过少了些文件
如果不支持Fluorine模板的话.那就需要你自己手动配置Flash Remoting了,大致和上面的目录差不多就可以..具体的网上应该有介绍,
上图flex文件夹下少了两个xml文件 这里贴出来:

如果你使用的是跟我一样的环境的话,这些配置默认就可以,.我也没有做过深入研究
创建好之后 我的地址是 http://localhost:9313/WebFlexService/ 这个要留着..
创建 Flex项目
我使用的是Adobe Flash Builder 4所以这里创建的时候或许有些不同
创建Flex项目..

选择ColdFusion ,选中该ColdFusion Flash Remoting
Next!

这个是我的配置,但总感觉不对,咱是做.net的,还得选中部署到J2EE服务器,心中有些不爽.但是选择独立那个,总是配置不成功,也就只能这样了..
利用 Remoting通讯可以接收服务器端传递的 带参数,数组,集合等等格式的数据.
这里演示这几种传送数据的方式
.net端代码:
//这句话很重要
[RemotingService("Fluorine sample service")]
public class Sample
{
public Sample()
{
}
public string HelloWord()
{
return "Hello Word!";
}
public string SayHello(string name)
{
return "Hello " + name + "!";
}
public string[] GetArray()
{
string[] array = new string[] { "张三", "李四", "王五" };
return array;
}
public List<User> GetUsers()
{
List<User> users = new List<User>();
User user = new User();
user.Name = "张三";
user.Age = 23;
user.Sex = "男";
users.Add(user);
user = new User();
user.Name = "李四";
user.Age = 24;
user.Sex = "女";
users.Add(user);
user = new User();
user.Name = "王五";
user.Age = 22;
user.Sex = "男";
users.Add(user);
return users;
}
}
Flex端代码:
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.containers.Form;
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
public function RemoteResult(cvt:ResultEvent):void
{
var str:String = "";
switch(cvt.currentTarget.name)
{
case "HelloWord"://无参数
str = cvt.result as String;
this.showtxt.text = str;
break;
case "SayHello"://带参数
str = cvt.result as String;
this.SayHellotxt.text = str;
break;
case "GetArray"://数组
for(var i:int = 0;i<cvt.result.length;i++){
this.showGetArraytxt.text += cvt.result[i].toString() + ",";
}
break;
case "GetUsers"://传递实体对象
var userArray:ArrayCollection = new ArrayCollection();
for(var j:int = 0;j<cvt.result.length;j++){
var user:User = cvt.result[j] as User;
userArray.addItem(user);
}
this.dgGrid.dataProvider = userArray;
break;
}
}
public function RemoteFault(cvt:FaultEvent):void
{
Alert.show("Message:" + cvt.fault.faultString,"出错");
}
]]>
</fx:Script>
<fx:Declarations>
<mx:RemoteObject
id="sampleRemoteObject"
destination="fluorine"
source="Sample"
showBusyCursor="true">
<!--这里是.NET中的方法,name = 方法名 -->
<mx:method name="HelloWord" result="RemoteResult(event)" fault="RemoteFault(event)"/>
<mx:method name="SayHello" result="RemoteResult(event)" fault="RemoteFault(event)"/>
<mx:method name="GetArray" result="RemoteResult(event)" fault="RemoteFault(event)"/>
<mx:method name="GetUsers" result="RemoteResult(event)" fault="RemoteFault(event)"/>
</mx:RemoteObject>
</fx:Declarations>
<mx:Text id="showtxt" text="" x="63" y="34" width="145" height="23">
</mx:Text>
<s:Button x="87" y="85" label="调用HelloWord" click="sampleRemoteObject.HelloWord()" />
<s:Label id="SayHellotxt" x="312" y="17" text="" width="160" height="22"/>
<s:Button x="329" y="85" label="调用SayHello" width="103" click="sampleRemoteObject.SayHello(this.nameInput.text)"/>
<s:TextInput id="nameInput" x="312" y="44" width="160"/>
<s:Label x="63" y="149" id="showGetArraytxt" text="" width="145" height="24"/>
<s:Button x="87" y="196" label="调用GetArray" width="102" click="sampleRemoteObject.GetArray()"/>
<mx:DataGrid id="dgGrid" x="307" y="131" width="296" height="113">
<mx:columns>
<mx:DataGridColumn headerText="姓名" dataField="Name"/>
<mx:DataGridColumn headerText="年龄" dataField="Age"/>
<mx:DataGridColumn headerText="性别" dataField="Sex"/>
</mx:columns>
</mx:DataGrid>
<s:Button x="382" y="277" label="调用GetUsers" click ="sampleRemoteObject.GetUsers()"/>
效果图:
