Flex与服务器交互之二（使用HTTPService同服务器交互） .

snoopy7713

浏览: 1152152 次
性别:
来自: 火星郊区

最近访客更多访客>>

青木落扬

jccz_zys

msn877763580

yushi103

博主相关

博客

微博

相册

留言

关于我

博客专栏

: OSGi
浏览量：0

文章分类

社区版块

存档分类

博客分类：

Flex

flex

由于Flex只是一种客户端技术其本身并不能直接同数据库交互，在实际的应用开发过程中Flex提供了如URLRequest、HTTPService、RemoteObject、WebService等类以实现同服务器的通讯和数据交互，下面做一些介绍和实例解析:
   1、使用HTTPService组件同服务器交互
      使用过程中在程序中添加一个HTTPService组件，设置它的请求接收数据的URL 调用Send方法发送请求，设置result和fault事件函数接收ResultEvent和FaultEvent对象获取返回数据或捕获错误
     HTTPService官方帮助文档http://livedocs.adobe.com/flex/3/html/help.html?content=data_access_2.html
     HTTPService组件相关属性和事件:

[xhtml] view plain copy print ?

<mx:HTTPService
Properties
concurrency="multiple|single|last"
contentType="application/x-www-form-urlencoded|application/xml"
destination="DefaultHTTP"
id="No default."
method="GET|POST|HEAD|OPTIONS|PUT|TRACE|DELETE"//请求数据的HTTP头
resultFormat="object|array|xml|e4x|flashvars|text"
showBusyCursor="false|true"
makeObjectsBindable="false|true"
url="No default." //请求的URL可以是PHP,ASPX,JSP....
useProxy="false|true"
xmlEncode="No default."
xmlDecode="No default."
Events
fault="No default." //请求发行错误时触发的事件
result="No default." //请求完成后触发的事件以处理返回结果
/>

[xhtml] view plain copy print ?

import mx.rpc.events.FaultEvent;
import mx.collections.XMLListCollection;
import flash.events.Event;
import mx.utils.URLUtil;
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;

import mx.rpc.events.FaultEvent; import mx.collections.XMLListCollection; import flash.events.Event; import mx.utils.URLUtil; import mx.collections.ArrayCollection; import mx.rpc.events.ResultEvent;
   2、应用示例一（向服务器发送请求并传递参数）：
     服务器端代码:

[c-sharp] view plain copy print ?

protected void Page_Load(object sender, EventArgs e)
{
//获取URLResuest请求回的参数返回数据用；分隔以方便Flex对数据进行序列化
string rs = String.Format("name={0};age={1};address={2}",Request.QueryString["name"],
Request.QueryString["age"],
Request.QueryString["address"]);
Response.ClearContent();
Response.ContentType = "text/plain";
Response.Write(rs); //以文本形式返回数据
Response.End();
}

protected void Page_Load(object sender, EventArgs e) { //获取URLResuest请求回的参数返回数据用；分隔以方便Flex对数据进行序列化 string rs = String.Format("name={0};age={1};address={2}",Request.QueryString["name"], Request.QueryString["age"], Request.QueryString["address"]); Response.ClearContent(); Response.ContentType = "text/plain"; Response.Write(rs); //以文本形式返回数据 Response.End(); }
Felx代码：
引入HTTPService组件（<mx:request></mx:request>节点中是请求的参数）：

[xhtml] view plain copy print ?

<mx:HTTPService id="hsText" url="http://localhost:2222/FlexService/TextFrm.aspx" resultFormat="object" result="hsResultTextHandler(event);" fault="hsResultError(event)" >
<mx:request xmlns="">
<name>Peter</name>
<age>15</age>
<address>ShenZhen GuangDong China</address>
</mx:request>
</mx:HTTPService>

<mx:HTTPService id="hsText" url="http://localhost:2222/FlexService/TextFrm.aspx" resultFormat="object" result="hsResultTextHandler(event);" fault="hsResultError(event)" > <mx:request xmlns=""> <name>Peter</name> <age>15</age> <address>ShenZhen GuangDong China</address> </mx:request> </mx:HTTPService>
Flex中发送请求：

[xhtml] view plain copy print ?

private function getText():void
{
hsText.send();
labMsg.alpha = 1;
}

private function getText():void { hsText.send(); labMsg.alpha = 1; }
Flex中接收返回数据:

[c-sharp] view plain copy print ?

private function hsResultTextHandler(e:ResultEvent):void
{
var o:Object = URLUtil.stringToObject(String(e.result)); //使用URLUtil对将数据进行反序列化以方便使用
txtName.text = o.name;
txtAge.text = o.age;
txtAddress.text = o.address;
labMsg.alpha = 0;
}

private function hsResultTextHandler(e:ResultEvent):void { var o:Object = URLUtil.stringToObject(String(e.result)); //使用URLUtil对将数据进行反序列化以方便使用 txtName.text = o.name; txtAge.text = o.age; txtAddress.text = o.address; labMsg.alpha = 0; }
Flex中错误处理：

[c-sharp] view plain copy print ?

private function hsResultError(e:FaultEvent):void
{
Alert.show(e.message.toString()); //如当访问的页面不存在时跳转执行如下操作
//异常要执行的操作
labMsg.alpha = 0;
}

private function hsResultError(e:FaultEvent):void { Alert.show(e.message.toString()); //如当访问的页面不存在时跳转执行如下操作 //异常要执行的操作 labMsg.alpha = 0; }
   3、应用示例二(向服务器发送请求返回XML数据并绑定到Grid中)：
       服务器端代码:

[c-sharp] view plain copy print ?

protected void Page_Load(object sender, EventArgs e)
{
String s = @"<?xml version=""1.0"" encoding=""utf-8""?>
<EV_ChartData_Scatter xmlns=""http://www.Richardjun.com/ChartData/XML"">
<ScatterItem id=""0"">
<CAN_ITEM_ID>561</CAN_ITEM_ID>
<CAN_ITEM_NAME>主控ECU通讯状况</CAN_ITEM_NAME>
<ITEM_VALUE>0</ITEM_VALUE>
<MATCH_VALUE>正常</MATCH_VALUE>
</ScatterItem>
<ScatterItem id=""1"">
<CAN_ITEM_ID>561</CAN_ITEM_ID>
<CAN_ITEM_NAME>主控ECU通讯状况</CAN_ITEM_NAME>
<ITEM_VALUE>1</ITEM_VALUE>
<MATCH_VALUE>丢包</MATCH_VALUE>
</ScatterItem>
</EV_ChartData_Scatter>";
Response.ClearContent();
Response.ContentType = "text/xml";
Response.Write(s);
Response.End();
}

protected void Page_Load(object sender, EventArgs e) { String s = @"<?xml version=""1.0"" encoding=""utf-8""?> <EV_ChartData_Scatter xmlns=""http://www.Richardjun.com/ChartData/XML""> <ScatterItem id=""0""> <CAN_ITEM_ID>561</CAN_ITEM_ID> <CAN_ITEM_NAME>主控ECU通讯状况</CAN_ITEM_NAME> <ITEM_VALUE>0</ITEM_VALUE> <MATCH_VALUE>正常</MATCH_VALUE> </ScatterItem> <ScatterItem id=""1""> <CAN_ITEM_ID>561</CAN_ITEM_ID> <CAN_ITEM_NAME>主控ECU通讯状况</CAN_ITEM_NAME> <ITEM_VALUE>1</ITEM_VALUE> <MATCH_VALUE>丢包</MATCH_VALUE> </ScatterItem> </EV_ChartData_Scatter>"; Response.ClearContent(); Response.ContentType = "text/xml"; Response.Write(s); Response.End(); }
Felx代码：
引入HTTPService组件

[c-sharp] view plain copy print ?

<mx:HTTPService id="hsXML" url="http://localhost:2222/FlexService/XMLFrm.aspx" resultFormat="object" result="onXMLResult(event);" />

<mx:HTTPService id="hsXML" url="http://localhost:2222/FlexService/XMLFrm.aspx" resultFormat="object" result="onXMLResult(event);" />
Flex中发送请求：

[c-sharp] view plain copy print ?

private function getXML():void
{
hsXML.send();
labMsg.alpha = 1;
}

private function getXML():void { hsXML.send(); labMsg.alpha = 1; }
Flex中接收返回数据:

[c-sharp] view plain copy print ?

[Bindable]
private var scatters:ArrayCollection;//主要用于绑定Grid
private function onXMLResult(e:ResultEvent):void
{
scatters = e.result.EV_ChartData_Scatter.ScatterItem;
}

[Bindable] private var scatters:ArrayCollection;//主要用于绑定Grid private function onXMLResult(e:ResultEvent):void { scatters = e.result.EV_ChartData_Scatter.ScatterItem; }
Flex中绑定Grid代码:

[c-sharp] view plain copy print ?

<mx:Canvas x="400" y="0" width="350" height="200" borderColor="#000000" themeColor="#DCD0D0" backgroundColor="#84DACF">
<mx:DataGrid x="10" y="10" width="333" id="grid1" dataProvider="{scatters}" height="140">
<mx:columns>
<mx:DataGridColumn headerText="CAN_ITEM_ID " dataField="CAN_ITEM_ID" />
<mx:DataGridColumn headerText="CAN_ITEM_NAME " dataField="CAN_ITEM_NAME" />
<mx:DataGridColumn headerText=" MATCH_VALUE" dataField="MATCH_VALUE" />
</mx:columns>
</mx:DataGrid>
<mx:Button x="148" y="160" label="getXML" id="btnGetXML" click="getXML();"/>
</mx:Canvas>

<mx:Canvas x="400" y="0" width="350" height="200" borderColor="#000000" themeColor="#DCD0D0" backgroundColor="#84DACF"> <mx:DataGrid x="10" y="10" width="333" id="grid1" dataProvider="{scatters}" height="140"> <mx:columns> <mx:DataGridColumn headerText="CAN_ITEM_ID " dataField="CAN_ITEM_ID" /> <mx:DataGridColumn headerText="CAN_ITEM_NAME " dataField="CAN_ITEM_NAME" /> <mx:DataGridColumn headerText=" MATCH_VALUE" dataField="MATCH_VALUE" /> </mx:columns> </mx:DataGrid> <mx:Button x="148" y="160" label="getXML" id="btnGetXML" click="getXML();"/> </mx:Canvas>
最终结果：

分享到：

Flex与服务器交互之三（使用WebService组件 ... | Flex与服务器交互之一（URLRequest +URLLoa ...

2012-02-14 08:14
浏览 855
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

博客专栏

文章分类

社区版块

存档分类

最新评论