Flex中使用HTTPService与服务器端交换数据

标签：Flex 职场 休闲 HTTPService

Flex与服务器端交换数据最常见的方法就是使用HTTPService类。

【ActionScript 3.0 Language and Components Reference】是这样定义HTTPService类的：

在 MXML 文件中使用 <mx:HTTPService> 标签代表 HTTPService 对象。当调用 HTTPService 对象的 send() 方法时，将发出对指定 URL 的 HTTP 请求，并且返回 HTTP 响应。可以选择向指定 URL 传递参数。如果没有使用基于服务器的代理服务，则只能使用 HTTP GET 或 POST 方法。如果将 useProxy 属性设置为 true 并使用基于服务器的代理服务，则还可以使用 HTTP HEAD、OPTIONS、TRACE 和 DELETE 方法。

注意：由于软件限制，当使用 GET 时 HTTPService 不生成用户界面友好的错误消息。

 

MXML 语法如下：

<mx:HTTPService
 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"
 resultFormat="object|array|xml|e4x|flashvars|text"
 showBusyCursor="false|true"
 makeObjectsBindable="false|true"
 url="No default."
 useProxy="false|true"
 xmlEncode="No default."
 xmlDecode="No default."
 fault="No default."
 result="No default."
 />
该类还有4个常见的公共方法：

HTTPService：创建一个新的HTTPService;
cancle：取消上一次HTTPService请求；
initialized:如果在 ActionScript 中创建此类并希望在其执行时使用验证，
则必须调用此方法并传入 MXML 文档和 HTTPService 的 id。 
send:执行HTTPService请求
其他属性及方法，请参见【ActionScript 3.0 Language and Components Reference】

 

1.使用HTTPService请求数据

<mx:HTTPService id="feedRequest" url="http://weblogs.macromedia.com/mchotin/index.xml" useProxy="false" />

在适当的时候调用HTTPService的send()方法。

一个完整的例子：

  
  

   
   <?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
   
   http://www.adobe.com/2006/mxml" layout="absolute" 
creationComplete="feedRequest.send()">
 
 <mx:HTTPService id="feedRequest" url="
   
   http://weblogs.macromedia.com/mchotin/index.xml"
 useProxy="false" />
 
 <mx:Panel title="{feedRequest.lastResult.rss.channel.title}" width="431" height="374" y="69" 
layout="absolute" horizontalCenter="0">
  <mx:DataGrid id="datePanel" x="10" y="10" 
dataProvider="{feedRequest.lastResult.rss.channel.item}" width="391">
   <mx:columns>
    <mx:DataGridColumn headerText="Column 1" dataField="title"/>
    <mx:DataGridColumn headerText="Column 2" dataField="description"/>
    <mx:DataGridColumn headerText="Column 3" dataField="link"/>
   </mx:columns>
  </mx:DataGrid>
  <mx:TextArea htmlText="{datePanel.selectedItem.pubDate}" y="174" left="10" right="10">
</mx:TextArea>
  <mx:LinkButton label="Go" x="139" y="243"
 click="navigateToURL(new URLRequest(datePanel.selectedItem.link))"/>
 </mx:Panel>
</mx:Application>
  
  

该例子，在Flex创建完成后，在creationComplete中调用send()方法执行HTTPService请求。

在DataGrid中通过dataProvider绑定数据。每一列的dataField就是XML中对应的标签名。

2.使用HTTPService提交数据

在【ActionScript 3.0 Language and Components Reference】有这样一句话：

The <mx:HTTPService> tag can have a single <mx:request> tag 
under which the parameters can be specified.

意思就是，可以在HTTPService中使用request像服务器传递数据

例如：

  
  

   
   <mx:HTTPService id="userRequest" url="
   
   http://localhost/flex.php" useProxy="false" method="POST">
  <mx:request xmlns="">
   <username>{username.text}</username><password>{pass.text}</password>
  </mx:request>
 </mx:HTTPService>
 <mx:Form x="22" y="10" width="356">
  <mx:HBox>
   <mx:Label text="Username"/>
   <mx:TextInput id="username"/>
  </mx:HBox>
  <mx:HBox>
   <mx:Label text="PassWord"/>
   <mx:TextInput id="pass"/>
  </mx:HBox>
  <mx:Button label="Submit" click="userRequest.send()"/>
 </mx:Form>
  
  

这是一个简单的登陆例子，request中的username和password就是传递给
服务器的变量名，{username.text}和{pass.text}就是变量的值，
提交数据的方式在HTTPService的method属性中指定。
这样在服务器端就可以获取传递过来的值，并进行处理，
然后返回处理结果给Flex应用，Flex中可以使用HTTPService的result事件
处理返回的结果，再由Flex展现处理结果。