Flex调用Webservice实现天气预报

这两天在学习Flex调用Webservice的实现。做了一个天气预报，下面是代码和心得。

Flex调用Webservice有多种方法，可以通过Flex Builder提供的管理Webservices的工具解析WSDL文档生成本地调用类。也可以通过Action Script中Webservice类来实现。还有就是使用<Webservice>组件实现。这次我使用的是最后一种，感觉这种方法较为简洁。

1.构建界面。用于接受用户输入及结果输出。包括：1个Text输入组件，1个按钮组件，10个标签组件

2.添加Webservice组件。根据Web服务提供者的说明，构建Webservice组件。代码如下：

< mx:WebService  id ="ws"  wsdl ="http://www.webxml.com.cn/WebServices/WeatherWebService.asmx?wsdl"
         useProxy ="false"  showBusyCursor ="true" >
         < mx:operation  name ="getWeatherbyCityName"  result ="resultOK()" >
             < mx:request >
                 < theCityName >
                    {city.text.toString()}
                 </ theCityName >
             </ mx:request >
         </ mx:operation >
</ mx:WebService >

注意：operation组件中的name属性需要和待使用的方法的名字相同。result的属性是在调用方法成功后执行的Action Script 方法。operation还有其他属性，鉴于例子很简单，就不一一使用了。

3.编写Action Script方法。本例中使用了三个方法： resultOK()用于显示结果的，showMessage()用于显示说明，getfocus()用于当输入栏得到焦点时清空输入栏内容的。下面是resultOK()的分析：

public function resultOK():void{        //显示接受的结果
            arrayResult=new ArrayCollection();
            arrayResult=ws.getWeatherbyCityName.lastResult;
            
            //显示今天的情况
            jin1.text=arrayResult[6].toString().substring(0,arrayResult[6].toString().indexOf(" "));
            jin2.text=arrayResult[6].toString().substring((arrayResult[6].toString().indexOf(" "))+1);
            jin3.text=arrayResult[5];
            jin4.text=arrayResult[7];
            
            //显示明天的情况
            ming1.text=arrayResult[13].toString().substring(0,arrayResult[13].toString().indexOf(" "));
            ming2.text=arrayResult[13].toString().substring((arrayResult[13].toString().indexOf(" "))+1);
            ming3.text=arrayResult[12];
            ming4.text=arrayResult[14];
            
            //显示后天的情况
            hou1.text=arrayResult[18].toString().substring(0,arrayResult[18].toString().indexOf(" "));
            hou2.text=arrayResult[18].toString().substring((arrayResult[18].toString().indexOf(" "))+1);
            hou3.text=arrayResult[17];
            hou4.text=arrayResult[19];
        }

在使用Web服务返回的结果时，发现其结果保存在字符数组中的，在WSDL中是ArrayOfString，而Flex没有这种格式，在试过String，Array类型后，发现ArrayCollection类可以使用。然后就是显示结果，可根据WSDL说明来挑选信息。

4.使用按钮调用Webservice组件，发送Web服务信息。即调用ws.getWeatherbyCityName.send()方法。

编译发布swf文件。

求助：在使用swf文件的时候有这样的问题，不晓得怎么把flex导出的swf嵌入Html中。普通的嵌入，不能实现调用Web服务的功能，使用项目生成的文件包中的Html文件倒是可以，但是如果把文件包复制出来，放到另外的地方，又无法使用Web服务了。那位高手能够给予帮助，在下将不胜感激。

完整代码如下

<? xml version="1.0" encoding="gb2312" ?>
< mx:Application  xmlns:mx ="http://www.adobe.com/2006/mxml"  width ="330"  
    height ="155"  layout ="absolute"  fontSize ="12"  viewSourceURL ="srcview/index.html" >
< mx:Script >
     <![CDATA[
    import mx.controls.Alert;
        import mx.collections.ArrayCollection;
        public var arrayResult:ArrayCollection;    //保存接收到的结果
        public function resultOK():void{        //显示接受的结果
            arrayResult=new ArrayCollection();
            arrayResult=ws.getWeatherbyCityName.lastResult;
            
            //显示今天的情况
            jin1.text=arrayResult[6].toString().substring(0,arrayResult[6].toString().indexOf(" "));
            jin2.text=arrayResult[6].toString().substring((arrayResult[6].toString().indexOf(" "))+1);
            jin3.text=arrayResult[5];
            jin4.text=arrayResult[7];
            
            //显示明天的情况
            ming1.text=arrayResult[13].toString().substring(0,arrayResult[13].toString().indexOf(" "));
            ming2.text=arrayResult[13].toString().substring((arrayResult[13].toString().indexOf(" "))+1);
            ming3.text=arrayResult[12];
            ming4.text=arrayResult[14];
            
            //显示后天的情况
            hou1.text=arrayResult[18].toString().substring(0,arrayResult[18].toString().indexOf(" "));
            hou2.text=arrayResult[18].toString().substring((arrayResult[18].toString().indexOf(" "))+1);
            hou3.text=arrayResult[17];
            hou4.text=arrayResult[19];
        }
        
        //显示说明
        public function showMessage():void{
            var alert:Alert=Alert.show("请输入城市中文名称(国外城市可用英文)。web服务来源于http://www.webxml.com.cn，数据来源于中国气象局" + 
                    "，包括340多个中国" + 
                    "主要城市和60多个国外主要城市三日内的天气情况。作者EMAIL：[email protected]","说明",Alert.YES);
        }
        
        //处理当输入栏获得焦点时，输入栏清空
        public function getfocus():void{
            city.text="";
        }
     ]]>
</ mx:Script >


     < mx:WebService  id ="ws"  wsdl ="http://www.webxml.com.cn/WebServices/WeatherWebService.asmx?wsdl"
         useProxy ="false"  showBusyCursor ="true" >
         < mx:operation  name ="getWeatherbyCityName"  result ="resultOK()" >
             < mx:request >
                 < theCityName >
                    {city.text.toString()}
                 </ theCityName >
             </ mx:request >
         </ mx:operation >
     </ mx:WebService >
    
     < mx:TextInput  id ="city"  text ="请输入城市名，支持国内外主要城市"  
        width ="200"  x ="10"  y ="10"  focusIn ="getfocus()"  fontSize ="12"  color ="#909697" />
        
     < mx:Button  id ="check"  x ="230"  y ="10"  label ="查询"  click ="ws.getWeatherbyCityName.send()" />
    
     <!-- 显示结果的Label -->
     < mx:Label  x ="10"  y ="42"  text =""  width ="90"  id ="jin1" />
     < mx:Label  x ="10"  y ="70"  text =""  width ="90"  id ="jin2" />
     < mx:Label  x ="10"  y ="98"  text =""  width ="90"  id ="jin3" />
     < mx:Label  x ="10"  y ="126"  text =""  width ="90"  id ="jin4" />
     < mx:Label  x ="120"  y ="42"  text =""  width ="90"  id ="ming1" />
     < mx:Label  x ="120"  y ="70"  text =""  width ="90"  id ="ming2" />
     < mx:Label  x ="120"  y ="98"  text =""  width ="90"  id ="ming3" />
     < mx:Label  x ="120"  y ="126"  text =""  width ="90"  id ="ming4" />
     < mx:Label  x ="230"  y ="41"  text =""  width ="90"  id ="hou1" />
     < mx:Label  x ="230"  y ="69"  text =""  width ="90"  id ="hou2" />
     < mx:Label  x ="230"  y ="97"  text =""  width ="90"  id ="hou3" />
     < mx:Label  x ="230"  y ="125"  text =""  width ="90"  id ="hou4" />
    
     <!-- 显示说明的Label -->
     < mx:Label  x ="288"  y ="12"  text ="说明"  width ="32"  textDecoration ="underline"  color ="#FAFBFB"  click ="showMessage()" />
</ mx:Application >