Flex与服务器交互之三(使用WebService组件同服务器WebService通讯)
2015-09-04 20:56
477 查看
原文链接:http://blog.csdn.net/xingjunli/article/details/5075869
由于Flex只是一种客户端技术其本身并不能直接同数据库交互,在实际的应用开发过程中Flex提供了如URLRequest、HTTPService、RemoteObject、WebService等类以实现同服务器的通讯和数据交互,下面做一些介绍和实例解析:
1、使用WebService组件同服务器交互
WSDL描述以供Flex WebService解析调用相关接口信息(如图):
使用过程中在程序中添加一个WebService组件,设置WSDL属性为WebService的WSDL地址 调用<mx:operation>节点中定义的方法,设置result和fault事件函数接收ResultEvent和FaultEvent对象获取返回数据或捕获错误
WebService组件官方帮助文档http://livedocs.adobe.com/flex/3/html/help.html?content=data_access_2.html
WebService组件相关属性和事件:http://livedocs.adobe.com/flex/3/langref/mx/rpc/soap/mxml/WebService.html
[xhtml]
view plaincopy
<mx:WebService
Properties
concurrency="multiple|single|last"
destination="No default."
id="No default."
serviceName="No default."
showBusyCursor="false|true"
makeObjectsBindable="false|true"
useProxy="false|true"
wsdl="No default." //请求的WSDL地址
Events
fault="No default." //请求发生错误时触发的事件(通常在下面<operation>具体的方法中再具体定义)
result="No default." //请求完成后触发的事件以处理返回结果
/>
WebService调用方法节点属性和事件(可包含多个)
[xhtml]
view plaincopy
<mx:operation
Properties
concurrency="multiple|single|last"
name=No default, required. //WebService方法名 必填
resultFormat="object|xml|e4x"
makeObjectsBindable="false|true"
Events
fault="No default." //请求发生错误时触发的事件
result="No default." //请求完成后触发的事件以处理返回结果
/>
2、应用示例:(调用WebService 根据用户输入的ID 查询返回XML中用户详细信息):
服务器端WebService定义:
[c-sharp]
view plaincopy
[WebService(Namespace = "http://csdn.richardjun.net/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
// [System.Web.Script.Services.ScriptService]
public class SearchUserService : System.Web.Services.WebService
{
[WebMethod]
public String SearchUserName(String useID)
{
XElement element = XElement.Load(Server.MapPath( @"/FlexService/Test.XML"));
IEnumerable<XElement> uses = from v in element.Elements().ToList()
where (String)v.Attribute("id") == useID
select v;
if (uses != null && uses.Count() > 0)
return uses.First().ToString();
else
return String.Empty;
}
}
服务器端用户详细信息Test.XML文件:
[xhtml]
view plaincopy
<?xml version="1.0" encoding="utf-8" ?>
<root xmlns="http:=//www.byd.com/ChartData/XML">
<User id="0">
<Name>宋江</Name>
<NikeName>天魁星</NikeName>
<Position>梁山泊寨主</Position>
<Weapon>锟吾剑</Weapon>
</User>
<User id="1">
<Name>卢俊义</Name>
<NikeName>天罡星</NikeName>
<Position>梁山泊副寨主</Position>
<Weapon>枪、棒</Weapon>
</User>
<User id="2">
<Name>吴用</Name>
<NikeName>天机星</NikeName>
<Position>梁山泊军师</Position>
<Weapon>铜链</Weapon>
</User>
<User id="3">
<Name>公孙胜</Name>
<NikeName>天闲星</NikeName>
<Position>梁山泊副军师</Position>
<Weapon>松纹古定剑</Weapon>
</User>
<User id="4">
<Name>大刀关胜</Name>
<NikeName>天勇星</NikeName>
<Position>梁山泊马军五虎大将之首</Position>
<Weapon>青龙偃月刀</Weapon>
</User>
<User id="5">
<Name>林冲</Name>
<NikeName>天雄星豹子头</NikeName>
<Position>梁山泊马军五虎大将之二</Position>
<Weapon>丈八蛇矛</Weapon>
</User>
</root>
Felx代码:
[c-sharp]
view plaincopy
<mx:Canvas x="10" y="218" width="393" height="200" backgroundColor="#84DACF">
<mx:Label x="4" y="10" text="UserID:"/>
<mx:Label x="60" y="83" width="160" id="labName" color="#C52167" fontSize="17"/>
<mx:Label x="60" y="109" width="160" id="labPosition" color="#C52167" fontSize="17"/>
<mx:Label x="60" y="57" width="160" id="labNikeName" color="#C52167" fontSize="17"/>
<mx:Button x="228" y="8" label="searchWebService" width="131" click="requestWebService();"/>
<mx:TextInput x="60" y="8" id="txtUserID"/>
</mx:Canvas>
引入WebService组件(<mx:operation></mx:operation>节点定义WebService定义的方法信息(对应WSDL文件的方法描述)可以为多个):
[c-sharp]
view plaincopy
<mx:WebService id="uReqWebService" wsdl="http://localhost:2222/FlexService/SearchUserService.asmx?WSDL">
<mx:operation name="SearchUserName" resultFormat="object" fault="serviceReqFault(event)" result="serviceReqResult(event)">
</mx:operation>
</mx:WebService>
Flex中发送请求:
[c-sharp]
view plaincopy
private function requestWebService():void
{
uReqWebService.SearchUserName(txtUserID.text); //<mx:operation/>定义的方法
labMsg.alpha = 1;
}
Flex中接收返回数据:
[c-sharp]
view plaincopy
private function serviceReqResult(e:ResultEvent):void
{
if(e.result.toString().length > 0)
{
var arry:XML = XML(e.result);
if(arry != null && arry.length()> 0)
{
labName.text = arry.children()[0];
labNikeName.text = arry.children()[1];
labPosition.text = arry.children()[2];
}
}
else
{
labName.text = "";
labNikeName.text = "";
labPosition.text = "";
Alert.show("查不到匹配的用户信息!");
}
labMsg.alpha = 0;
}
Flex中错误处理:
[c-sharp]
view plaincopy
private function serviceReqFault(e:FaultEvent):void
{
Alert.show("请求WebService出错!原因是:" + e.message);
labMsg.alpha = 0;
}
结果如图:
由于Flex只是一种客户端技术其本身并不能直接同数据库交互,在实际的应用开发过程中Flex提供了如URLRequest、HTTPService、RemoteObject、WebService等类以实现同服务器的通讯和数据交互,下面做一些介绍和实例解析:
1、使用WebService组件同服务器交互
WSDL描述以供Flex WebService解析调用相关接口信息(如图):
使用过程中在程序中添加一个WebService组件,设置WSDL属性为WebService的WSDL地址 调用<mx:operation>节点中定义的方法,设置result和fault事件函数接收ResultEvent和FaultEvent对象获取返回数据或捕获错误
WebService组件官方帮助文档http://livedocs.adobe.com/flex/3/html/help.html?content=data_access_2.html
WebService组件相关属性和事件:http://livedocs.adobe.com/flex/3/langref/mx/rpc/soap/mxml/WebService.html
[xhtml]
view plaincopy
<mx:WebService
Properties
concurrency="multiple|single|last"
destination="No default."
id="No default."
serviceName="No default."
showBusyCursor="false|true"
makeObjectsBindable="false|true"
useProxy="false|true"
wsdl="No default." //请求的WSDL地址
Events
fault="No default." //请求发生错误时触发的事件(通常在下面<operation>具体的方法中再具体定义)
result="No default." //请求完成后触发的事件以处理返回结果
/>
WebService调用方法节点属性和事件(可包含多个)
[xhtml]
view plaincopy
<mx:operation
Properties
concurrency="multiple|single|last"
name=No default, required. //WebService方法名 必填
resultFormat="object|xml|e4x"
makeObjectsBindable="false|true"
Events
fault="No default." //请求发生错误时触发的事件
result="No default." //请求完成后触发的事件以处理返回结果
/>
2、应用示例:(调用WebService 根据用户输入的ID 查询返回XML中用户详细信息):
服务器端WebService定义:
[c-sharp]
view plaincopy
[WebService(Namespace = "http://csdn.richardjun.net/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
// [System.Web.Script.Services.ScriptService]
public class SearchUserService : System.Web.Services.WebService
{
[WebMethod]
public String SearchUserName(String useID)
{
XElement element = XElement.Load(Server.MapPath( @"/FlexService/Test.XML"));
IEnumerable<XElement> uses = from v in element.Elements().ToList()
where (String)v.Attribute("id") == useID
select v;
if (uses != null && uses.Count() > 0)
return uses.First().ToString();
else
return String.Empty;
}
}
服务器端用户详细信息Test.XML文件:
[xhtml]
view plaincopy
<?xml version="1.0" encoding="utf-8" ?>
<root xmlns="http:=//www.byd.com/ChartData/XML">
<User id="0">
<Name>宋江</Name>
<NikeName>天魁星</NikeName>
<Position>梁山泊寨主</Position>
<Weapon>锟吾剑</Weapon>
</User>
<User id="1">
<Name>卢俊义</Name>
<NikeName>天罡星</NikeName>
<Position>梁山泊副寨主</Position>
<Weapon>枪、棒</Weapon>
</User>
<User id="2">
<Name>吴用</Name>
<NikeName>天机星</NikeName>
<Position>梁山泊军师</Position>
<Weapon>铜链</Weapon>
</User>
<User id="3">
<Name>公孙胜</Name>
<NikeName>天闲星</NikeName>
<Position>梁山泊副军师</Position>
<Weapon>松纹古定剑</Weapon>
</User>
<User id="4">
<Name>大刀关胜</Name>
<NikeName>天勇星</NikeName>
<Position>梁山泊马军五虎大将之首</Position>
<Weapon>青龙偃月刀</Weapon>
</User>
<User id="5">
<Name>林冲</Name>
<NikeName>天雄星豹子头</NikeName>
<Position>梁山泊马军五虎大将之二</Position>
<Weapon>丈八蛇矛</Weapon>
</User>
</root>
Felx代码:
[c-sharp]
view plaincopy
<mx:Canvas x="10" y="218" width="393" height="200" backgroundColor="#84DACF">
<mx:Label x="4" y="10" text="UserID:"/>
<mx:Label x="60" y="83" width="160" id="labName" color="#C52167" fontSize="17"/>
<mx:Label x="60" y="109" width="160" id="labPosition" color="#C52167" fontSize="17"/>
<mx:Label x="60" y="57" width="160" id="labNikeName" color="#C52167" fontSize="17"/>
<mx:Button x="228" y="8" label="searchWebService" width="131" click="requestWebService();"/>
<mx:TextInput x="60" y="8" id="txtUserID"/>
</mx:Canvas>
引入WebService组件(<mx:operation></mx:operation>节点定义WebService定义的方法信息(对应WSDL文件的方法描述)可以为多个):
[c-sharp]
view plaincopy
<mx:WebService id="uReqWebService" wsdl="http://localhost:2222/FlexService/SearchUserService.asmx?WSDL">
<mx:operation name="SearchUserName" resultFormat="object" fault="serviceReqFault(event)" result="serviceReqResult(event)">
</mx:operation>
</mx:WebService>
Flex中发送请求:
[c-sharp]
view plaincopy
private function requestWebService():void
{
uReqWebService.SearchUserName(txtUserID.text); //<mx:operation/>定义的方法
labMsg.alpha = 1;
}
Flex中接收返回数据:
[c-sharp]
view plaincopy
private function serviceReqResult(e:ResultEvent):void
{
if(e.result.toString().length > 0)
{
var arry:XML = XML(e.result);
if(arry != null && arry.length()> 0)
{
labName.text = arry.children()[0];
labNikeName.text = arry.children()[1];
labPosition.text = arry.children()[2];
}
}
else
{
labName.text = "";
labNikeName.text = "";
labPosition.text = "";
Alert.show("查不到匹配的用户信息!");
}
labMsg.alpha = 0;
}
Flex中错误处理:
[c-sharp]
view plaincopy
private function serviceReqFault(e:FaultEvent):void
{
Alert.show("请求WebService出错!原因是:" + e.message);
labMsg.alpha = 0;
}
结果如图:
相关文章推荐
- 反锯齿渲染技术--SMAA
- Windows下搭建IOS开发环境(二)
- android中的一些小技巧
- Neo4j基本用法
- 插入排序(二)
- 1054. The Dominant Color (20)
- 剑指offer 大数问题 全排列
- linux命令,个人的日记本
- android ui ->>Dialog对话框
- Stanford机器学习---第一讲. Linear Regression with one variable
- 【Latex】中插入图片(Excel和Visio绘制)不失真的方法
- Windows下搭建IOS开发环境(一)
- COCI试后心得
- 马戏团叠罗汉-之最长递增子序列
- LeetCode || Single Number III
- linux磁盘管理以及linux文件系统管理
- hdu 3127 WHU girls 2009武汉网络赛 dp
- 和芯星通科技(北京)有限公司
- Spring JTA multiple resource transactions in Tomcat with Atomikos example
- 【CCF】数字排序