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 [code]<mx:HTTPService>

tag can have a single <mx:request> tag
under which the parameters can be specified.[/code]

意思就是，可以在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展现处理结果。