Flex与.NET互操作使用HttpService、URLReqeust和URLLoader加载/传输数据

ActionScript 3.0中提供的数据加载请求类主要是HTTPService,URLLoader和URLRequest，可以通过他们协同来完成数据加载和请求。下面我么便来看看这三个类是怎么来完成数据加载工作。

在本地IIS服务器上有如下定义的XML文件：

1<?xmlversion="1.0"encoding="utf-8"?>

2<Root>

3<Book>

4<Id>1</Id>

5<Name>《三国演义》</Name>

6<Author>罗贯中</Author>

7<Price>52.30</Price>

8</Book>

9<Book>

10<Id>2</Id>

11<Name>《西游记》</Name>

12<Author>吴承恩</Author>

13<Price>39.91</Price>

14</Book>

15<Book>

16<Id>3</Id>

17<Name>《红楼梦》</Name>

18<Author>曹雪芹</Author>

19<Price>48.20</Price>

20</Book>

21<Book>

22<Id>4</Id>

23<Name>《水浒传》</Name>

24<Author>施耐庵</Author>

25<Price>39.85</Price>

26</Book>

27</Root>

一、使用HTTPService传递和加载数据

使用HTTPService可以实现加载数据，也可以实现参数传递，下面通过两个示例程序来讲解这两个知识点。

首先来看看HTTPService加载数据的方式。在Flex中使用HTTPService来装载外部数据是非常简单的，他是基于 HTTP协议发送POST和GET请求外部数据,然后通过指定的监听方法来处理响应。我们可以通过<mx:HTTPService>标签来完成对数据源的连接，也可以通过可编程方式来处理,两种方式没什么大的差距，实际开发中可以根据自己喜好选择。

1internalfunctiononClick():void

3varservice:HTTPService=newHTTPService();

4service.url="http://localhost:1146/Data/Book.xml";

5service.useProxy=false;

6service.resultFormat="e4x";

7service.addEventListener(ResultEvent.RESULT,onResultHandler);

8service.send();

11internalfunctiononResultHandler(evt:ResultEvent):void

12{

13varxml:XML=evt.resultasXML;

14trace(xml);

15bookGrid.dataProvider=xml.Book;

16}

该示例的运行结果见文章最后，下面是这个示例的完整代码：

完整示例代码

1<?xmlversion="1.0"encoding="utf-8"?>

2<mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="absolute">

3<mx:Script>

4<![CDATA[

5importmx.rpc.events.FaultEvent;

6importmx.rpc.events.ResultEvent;

7importmx.rpc.http.HTTPService;

9internalfunctiononClick():void

10{

11varservice:HTTPService=newHTTPService();

12service.url="http://localhost:1146/Data/Book.xml";

13service.useProxy=false;

14service.resultFormat="e4x";

15service.addEventListener(ResultEvent.RESULT,onResultHandler);

16service.send();

17}

19internalfunctiononResultHandler(evt:ResultEvent):void

20{

21varxml:XML=evt.resultasXML;

22trace(xml);

23bookGrid.dataProvider=xml.Book;

24}

25]]>

26</mx:Script>

28<mx:Panelx="49.5"y="94"width="419"height="267"layout="absolute"fontSize="12"title="使用HTTPService加载XML数据">

29<mx:DataGridx="10"y="10"width="377"id="bookGrid">

30<mx:columns>

31<mx:DataGridColumnheaderText="编号"dataField="Id"/>

32<mx:DataGridColumnheaderText="书名"dataField="Name"/>

33<mx:DataGridColumnheaderText="作者"dataField="Author"/>

34<mx:DataGridColumnheaderText="价格"dataField="Price"/>

35</mx:columns>

36</mx:DataGrid>

37<mx:ControlBarheight="42">

38<mx:Buttonlabel="加载数据"fontWeight="normal"click="onClick()"/>

39</mx:ControlBar>

40</mx:Panel>

41</mx:Application>

OK，我们来看看使用HTTPService传递参数到服务端是怎么实现的。使用HTTPService传递参数可以通过两种方式实现，分别如下：

1、直接在请求URL后面跟上参数列表，如：http://localhost/web/Test.aspx?a=1&b=2。

2、通过Flex SDK为我们提供专门用语参数传递的对象（URLVariables）来实现。

下面以一道简单的加法运算来演示HTTPService传递参数的使用，在Flex里将需要进行加法运算的两个数传递到.NET服务端并计算其和后返回给Flex客户端，两种方式传递没有太大的区别，详细请看如下代码演示：

1/**

2*通过RUL参数直接传递

3**/

4internalfunctiononClick():void

6varservice:HTTPService=newHTTPService();

7vara:String=txtA.text;

8varb:String=txtB.text;

9service.url="http://localhost:1146/OperationHandler.ashx?a="+a+"&b="+b;

10service.useProxy=false;

11service.resultFormat="e4x";

12service.addEventListener(ResultEvent.RESULT,onResultHandler);

13service.send();

14}

16/**

17*通过URLVariables进行参数传递

18**/

19internalfunctiononClick():void

20{

21varservice:HTTPService=newHTTPService();

22service.url="http://localhost:1146/OperationHandler.ashx";

23service.useProxy=false;

24service.resultFormat="e4x";

25service.addEventListener(ResultEvent.RESULT,onResultHandler);

26varparam:URLVariables=newURLVariables();

27param.a=txtA.text;

28param.b=txtB.text;

29service.send();

30}

下面是完整的示例代码，可以把onClick()方法相互切换来测试两种不同的参数传递方式。

完整的示例代码

1<?xmlversion="1.0"encoding="utf-8"?>

2<mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="absolute">

3<mx:Script>

4<![CDATA[

5importmx.rpc.events.FaultEvent;

6importmx.rpc.events.ResultEvent;

7importmx.rpc.http.HTTPService;

9/**

10*通过RUL参数直接传递

11**/

12internalfunctiononClick():void

13{

14varservice:HTTPService=newHTTPService();

15vara:String=txtA.text;

16varb:String=txtB.text;

17service.url="http://localhost:1146/OperationHandler.ashx?a="+a+"&b="+b;

18service.useProxy=false;

19service.resultFormat="e4x";

20service.addEventListener(ResultEvent.RESULT,onResultHandler);

21service.send();

22}

24/**

25*通过URLVariables进行参数传递

26**/

27//internalfunctiononClick():void

28//{

29//varservice:HTTPService=newHTTPService();

30//service.url="http://localhost:1146/OperationHandler.ashx";

31//service.useProxy=false;

32//service.resultFormat="e4x";

33//service.addEventListener(ResultEvent.RESULT,onResultHandler);

34//varparam:URLVariables=newURLVariables();

35//&nbs;=newURLVariables();

35//param.a=txtA.text;

36//param.b=txtB.text;

37//service.send();

38//}

40internalfunctiononResultHandler(evt:ResultEvent):void

41{

42ab.text=evt.result.toString();

43}

44]]>

45</mx:Script>

47<mx:Panelx="49.5"y="94"width="419"height="126"layout="absolute"fontSize="12"title="使用HTTPService传递参数">

48<mx:TextInputx="33"y="10"width="91"id="txtA"/>

49<mx:Labelx="10"y="12"text="A："/>

50<mx:Labelx="132"y="12"text="B："/>

51<mx:TextInputx="165"y="10"id="txtB"width="79"/>

52<mx:Labelx="252"y="12"text="A+B："/>

53<mx:TextInputx="293"y="10"width="95"id="ab"/>

54<mx:ControlBarheight="44">

55<mx:Buttonlabel="计算"fontWeight="normal"click="onClick()"/>

56</mx:ControlBar>

57</mx:Panel>

58</mx:Application>

59 OperationHandler.ashx

1publicclassOperationHandler:IHttpHandler

4publicvoidProcessRequest(HttpContextcontext)

6context.Response.ContentType="text/plain";

8inta=int.Parse(context.Request.QueryString["a"]);

9intb=int.Parse(context.Request.QueryString["b"]);

11context.Response.Write((a+b).ToString());

12}

14publicboolIsReusable

15{

16get

17{

18returnfalse;

19}

20}

21}

上面示例的运行界面截图：

二、了解URLReqeust

使用URLRequest 类可捕获单个 HTTP 请求中的所有信息。将URLRequest 对象传递给URLStream或URLLoader 类以及其他加载操作的load()方法以启动URL数据加载。它的使用很简单，通过构造方法构造对象就OK：

1varrequest:URLRequest=newURLRequest("http://localhost:1146/Data/Book.xml")

同样可以使用URLRequest来请求一个本地项目/应用里的文件，如下代码示例：

1varrequest:URLRequest=newURLRequest("Data/Book.xml")

如上便构造好了URLRequest对象，只要将他传递给相应的对象load()方法便可实现数据加载。从某种角度可以将 URLRequest理解为建立请求的工具。要是URLRequest类对象变成可用的对象还需得通过其他类来与之配合协作，详细见后面使用 URLLoader加载数据。

URLRequest虽然功能强大,使用简单。但我们还是需要了解更多的东西，以便可以正确的应用URLRequest类和处理相应的错误。其中最引人关注的就是安全沙箱的问题，这部分我将在以后的文章中介绍，这里只需要记住两点就OK。

1、如果执行调用的 SWF 文件在只能与本地文件系统内容交互的沙箱中，而目标资源来自网络沙箱，则不允许进行数据加载。

2、如果执行调用的 SWF 文件来自网络沙箱而目标资源在本地，也不允许进行数据加载。

这里就简单介绍这些，关于URLRequest的详细资料大家可以查看官方提供的在线文档：http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/net/URLRequest.html

三、使用URLLoader加载数据

URLLoader 类可以以文本、二进制数据或 URL 编码变量的形式从 URL 下载数据。下面将结合使用本地服务器上的数据(详细见文章前面的xml文件定义)的加载示例来演示URLLoader的使用方法。

那我们怎么通过URLLoader来加载它呢？很简单，使用上面介绍的URLRequest来创建请求连接，然后将URLRequest对象传递给URLLoader的load方法来实现数据加载。

1internalfunctiononClick():void

3varrequest:URLRequest=newURLRequest("http://localhost:1146/Data/Book.xml");

4varloader:URLLoader=newURLLoader();

5loader.load(request);

6loader.addEventListener(Event.COMPLETE,onCompleteHandler);

9privatefunctiononCompleteHandler(evt:Event):void

10{

11varxml:XML=newXML(evt.target.data);

12bookGrid.dataProvider=xml.Book;

13}

下面是整个mxml的代码定义：

mxml完整代码

1<?xmlversion="1.0"encoding="utf-8"?>

2<mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="absolute">

3<mx:Script>

4<![CDATA[

5internalfunctiononClick():void

7varrequest:URLRequest=newURLRequest("http://localhost:1146/Data/Book.xml");

8varloader:URLLoader=newURLLoader();

9loader.load(request);

10loader.addEventListener(Event.COMPLETE,onCompleteHandler);

11}

13privatefunctiononCompleteHandler(evt:Event):void

14{

15varxml:XML=newXML(evt.target.data);

16bookGrid.dataProvider=xml.Book;

17}

18]]>

19</mx:Script>

20<mx:Panelx="49.5"y="94"width="419"height="267"layout="absolute"fontSize="12"borderColor="#E2E2E2"themeColor="#009DDF"title="使用URLLoader加在XML数据">

21<mx:DataGridx="10"y="10"width="377"id="bookGrid">

22<mx:columns>

23<mx:DataGridColumnheaderText="编号"dataField="Id"/>

24<mx:DataGridColumnheaderText="书名"dataField="Name"/>

25<mx:DataGridColumnheaderText="作者"dataField="Author"/>

26<mx:DataGridColumnheaderText="价格"dataField="Price"/>

27</mx:columns>

28</mx:DataGrid>

29<mx:ControlBarheight="42">

30<mx:Buttonlabel="加载数据"fontWeight="normal"click="onClick()"/>

31</mx:ControlBar>

32</mx:Panel>

33</mx:Application>

本示例的运行结果如下图：

关于URLLoader的更多资料大家可以查看Adobe提供的在线文档：http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/net/URLLoader.html

p;param.a=txtA.text;

36//param.b=txtB.text;

37//service.send();

38//}

40internalfunctiononResultHandler(evt:ResultEvent):void

41{

42ab.text=evt.result.toString();

43}

44]]>

45</mx:Script>

47<mx:Panelx="49.5"y="94"width="419"height="126"layout="absolute"fontSize="12"title="使用HTTPService传递参数">

48<mx:TextInputx="33"y="10"width="91"id="txtA"/>

49<mx:Labelx="10"y="12"text="A："/>

50<mx:Labelx="132"y="12"text="B："/>

51<mx:TextInputx="165"y="10"id="txtB"width="79"/>

52<mx:Labelx="252"y="12"text="A+B："/>

53<mx:TextInputx="293"y="10"width="95"id="ab"/>

54<mx:ControlBarheight="44">

55<mx:Buttonlabel="计算"fontWeight="normal"click="onClick()"/>

56</mx:ControlBar>

57</mx:Panel>

58</mx:Application>

59 OperationHandler.ashx

1publicclassOperationHandler:IHttpHandler

4publicvoidProcessRequest(HttpContextcontext)

6context.Response.ContentType="text/plain";

8inta=int.Parse(context.Request.QueryString["a"]);

9intb=int.Parse(context.Request.QueryString["b"]);

11context.Response.Write((a+b).ToString());

12}

14publicboolIsReusable

15{

16get

17{

18returnfalse;

19}

20}

21}

上面示例的运行界面截图：

二、了解URLReqeust

1varrequest:URLRequest=newURLRequest("http://localhost:1146/Data/Book.xml")

同样可以使用URLRequest来请求一个本地项目/应用里的文件，如下代码示例：

1varrequest:URLRequest=newURLRequest("Data/Book.xml")

1、如果执行调用的 SWF 文件在只能与本地文件系统内容交互的沙箱中，而目标资源来自网络沙箱，则不允许进行数据加载。

2、如果执行调用的 SWF 文件来自网络沙箱而目标资源在本地，也不允许进行数据加载。

这里就简单介绍这些，关于URLRequest的详细资料大家可以查看官方提供的在线文档：http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/net/URLRequest.html

三、使用URLLoader加载数据

那我们怎么通过URLLoader来加载它呢？很简单，使用上面介绍的URLRequest来创建请求连接，然后将URLRequest对象传递给URLLoader的load方法来实现数据加载。

1internalfunctiononClick():void

3varrequest:URLRequest=newURLRequest("http://localhost:1146/Data/Book.xml");

4varloader:URLLoader=newURLLoader();

5loader.load(request);

6loader.addEventListener(Event.COMPLETE,onCompleteHandler);

9privatefunctiononCompleteHandler(evt:Event):void

10{

11varxml:XML=newXML(evt.target.data);

12bookGrid.dataProvider=xml.Book;

13}

下面是整个mxml的代码定义：

mxml完整代码

1<?xmlversion="1.0"encoding="utf-8"?>

2<mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="absolute">

3<mx:Script>

4<![CDATA[

5internalfunctiononClick():void

7varrequest:URLRequest=newURLRequest("http://localhost:1146/Data/Book.xml");

8varloader:URLLoader=newURLLoader();

9loader.load(request);

10loader.addEventListener(Event.COMPLETE,onCompleteHandler);

11}

13privatefunctiononCompleteHandler(evt:Event):void

14{

15varxml:XML=newXML(evt.target.data);

16bookGrid.dataProvider=xml.Book;

17}

18]]>

19</mx:Script>

20<mx:Panelx="49.5"y="94"width="419"height="267"layout="absolute"fontSize="12"borderColor="#E2E2E2"themeColor="#009DDF"title="使用URLLoader加在XML数据">

21<mx:DataGridx="10"y="10"width="377"id="bookGrid">

22<mx:columns>

23<mx:DataGridColumnheaderText="编号"dataField="Id"/>

24<mx:DataGridColumnheaderText="书名"dataField="Name"/>

25<mx:DataGridColumnheaderText="作者"dataField="Author"/>

26<mx:DataGridColumnheaderText="价格"dataField="Price"/>

27</mx:columns>

28</mx:DataGrid>

29<mx:ControlBarheight="42">

30<mx:Buttonlabel="加载数据"fontWeight="normal"click="onClick()"/>

31</mx:ControlBar>

32</mx:Panel>

33</mx:Application>

本示例的运行结果如下图：

关于URLLoader的更多资料大家可以查看Adobe提供的在线文档：http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/net/URLLoader.html