Flex与WebService通信

Flex与WebService通信

三峡大学土木水电学院肖泽云

首先介绍几个常用的WebService地址：
2400多个城市5日天气预报
http://www.webxml.com.cn/WebServices/WeatherWebService.asmx
国内手机号码归属地查询WEB服务
http://www.webxml.com.cn/WebServices/MobileCodeWS.asmx
国内飞机航班时刻表 WEB 服务
http://www.webxml.com.cn/webservices/DomesticAirline.asmx
股票行情数据 WEB 服务（支持香港、深圳、上海基金、债券和股票；支持多股票同时查询）
http://www.webxml.com.cn/WebServices/StockInfoWS.asmx
腾讯QQ在线状态
http://www.webxml.com.cn/webservices/qqOnlineWebService.asmx
Email 电子邮件地址验证
http://www.webxml.com.cn/WebServices/ValidateEmailWebService.asmx
中国电视节目预告（电视节目表）
http://www.webxml.com.cn/webservices/ChinaTVprogramWebService.asmx
火车时刻表
http://www.webxml.com.cn/WebServices/TrainTimeWebService.asmx
中文 <-> 英文双向翻译
http://www.webxml.com.cn/WebServices/TranslatorWebService.asmx
中国邮政编码
http://www.webxml.com.cn/WebServices/ChinaZipSearchWebService.asmx
IP地址来源搜索
http://www.webxml.com.cn/WebServices/IpAddressSearchWebService.asmx
天气预报Web服务，数据来源于中国气象局（预报数据每0.5小时左右自动更新一次）
http://www.webxml.com.cn/WebServices/WeatherWebService.asmx

Flex可以通过WebService组件来获取数据。下面开始以一个使用WebService调取天气预报信息的例子来说明Flex与WebService之间的通信。
天气预报的WebService网址为：
http://www.webxml.com.cn/WebServices/WeatherWebService.asmx
1、在MXML中添加WebService标签，如下：
<mx:WebService id="webService" wsdl="http://www.webxml.com.cn/WebServices/WeatherWebService.asmx?wsdl" showBusyCursor="true" result="onLoad(event)" fault="faultHandler(event)"/>
其中，wsdl为WebService网址，showBusyCursor表示是否显示忙碌光标，result用于用于调用返回的信息，fault表示出现错误时返回的信息。
2、添加常用组件，如文本输入框用于输入城市名称，按钮用于查询事件，文本区域用于显示返回的信息，如下：
<mx:TextInput id="cityname" text="北京" x="22" y="10" width="84"/>
<mx:Button label="查询" x="114" y="10"/>
<mx:TextArea id="myWeatherReport" height="100%" width="80%" editable="false"x="10" y="53"/>
3、为WebService定义onLoad（）函数及faultHandler（）函数。
当WebService获得数据后要设置其返回结果到文本区域控件myWeatherReport中，如下：
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.rpc.events.ResultEvent;
import mx.rpc.events.FaultEvent;
private function onLoad(event:ResultEvent):void{
var weatherInfo = event.result ;
myWeatherReport.text=weatherInfo;
}
private function faultHandler(event:FaultEvent):void{
Alert.show(event.fault.toString(),"WebService Error");
}
]]>
</mx:Script>
4、在按钮中启动WebService事件。
一般来说，发布的WebService中包含有很多对象、函数，可以通过城市的名称来查询天气、也可以通过代码来查询，还可以通过其他方式来查询等等（至于具体有哪些方式主要根据发布服务者的设计而定）。发布的WebService中具体包括哪些方法，可以通过将WebService网址后删除?wsdl然后再打开，如天气预报的WebService网址为http://www.webxml.com.cn/WebServices/WeatherWebService.asmx?wsdl，要获取该WebService中发布所有的方法，只需要输入http://www.webxml.com.cn/WebServices/WeatherWebService.asmx即可，如下图所示：

通过浏览该地址就可以获取发布的方法，其中有一个方法为getWeatherbyCityName，点击该方法，其输入参数只有一个，即城市的名称。所有在按钮的click事件中调用“webService.getWeatherbyCityName(cityname.text)”，其中getWeatherbyCityName为WebService服务中发布的函数名，cityname.text为输入的城市名称。具体如下：
<mx:Button label="查询" x="114" y="10" click="webService.getWeatherbyCityName(cityname.text)"/>
运行程序，其显示结果如下图所示：

5、从上面的查询天气返回的信息可以看到，虽说查询到了相关的信息，但是该信息比较混乱。如何整理这些数据？首先必须获取到返回信息的数据结构，即weatherInfo的结构类型。然后获取它的数据结构，可以通过前面打开的网页http://www.webxml.com.cn/WebServices/WeatherWebService.asmx中点击函数getWeatherbyCityName打开该函数的一些相关信息。如下图所示，可只该函数有一个输入参数，即theCityName。

同时我们还知道，它的返回数据为一个一维数组 String(22)，共有23个元素。String(0) 到 String(4)：省份，城市，城市代码，城市图片名称，最后更新时间。String(5) 到 String(11)：当天的 气温，概况，风向和风力，天气趋势开始图片名称(以下称：图标一)，天气趋势结束图片名称(以下称：图标二)，现在的天气实况，天气和生活指数。String(12) 到 String(16)：第二天的 气温，概况，风向和风力，图标一，图标二。String(17) 到 String(21)：第三天的 气温，概况，风向和风力，图标一，图标二。String(22) 被查询的城市或地区的介绍。
对于前面我们运行程序返回的一些杂乱信息我们通过这个解释就清楚了。它的返回数据为典型的XML数据结构，我们可以通过Flex的ArrayCollection数据结构来定义。如下：
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.utils.ArrayUtil;
import mx.controls.Alert;
import mx.rpc.events.ResultEvent;
import mx.rpc.events.FaultEvent;
private function onLoad(event:ResultEvent):void{
var weatherInfo:ArrayCollection = (event.result) as ArrayCollection;
for(var i:int=0;i<weatherInfo.length;i++){
myWeatherReport.text+=weatherInfo+"/n";
}
}
private function faultHandler(event:FaultEvent):void{
Alert.show(event.fault.toString(),"WebService Error");
}
]]>
</mx:Script>
运行程序，其显示结果如下图所示：