首页 / 软件开发 / Flex / Flex与.NET互操作(五):使用FileReference+HttpHandler实现文件上传/下载
Flex与.NET互操作(五):使用FileReference+HttpHandler实现文件上传/下载2011-07-11 博客园 Beniao Sailing在Flex的应用开发中,同ASP.NET,JSP,PHP等应用一样,都会有上传/下载文件的应用需求,Flex的SDK也为我们提供了专门的类 FileRefUdderence实现文件上传/下载 。Flex只是作为一个客户端,要实现上传或下载必须得为其提供一个服务端来接受上传或下载的请求, 本文以ASP.NET中的HttpHandler作为文件上传的服务端来完成上传功能。OK,我们从Flex客户端开始,看看客户端是通过什么方式想 服务端发起请求。Flex客户端要完成文件上传下载都是通过FileRefUdderence来实现,首先得定义一个该类型对象实例:1 [Bindable]
2 private var stateText:String = "请选择一个文件上传";
3 //通过调用file对象的方法来完成上传和下载 功能
4 private var file:FileReference = new FileReference();
上传文件通常涉及到的有选择文件、上传文件以及上传完成这些最基本的处理过程。OK,下面我们就以这三个过程为例来看看Flex是怎么来 完成文件的上传功能。首先为这三个功能点分别添加监听事件处理函数,在程序加载时调用:1 internal function initApp ():void
2 {
3 file.addEventListener(Event.SELECT,onSelected);
4 file.addEventListener (Event.COMPLETE,onCompleted);
5 file.addEventListener(ProgressEvent.PROGRESS,onProgress);
6 }
另外我们也可以不用上面这中定义一个函数在程序加载时调用进行初始化操作,应用程序(mxml)的初始化操作又creationComplete方法完成 ,另外还有一个比它先执行的方法createChildren(),我们可以直接在mxml下重写该方法来实现应用程序的初始化,如下:1 /**
2 * createChildren 比 creationComplete 事件更早发生
3 * */
4 protected override function createChildren ():void
5 {
6 file.addEventListener(Event.SELECT,onSelected);
7 file.addEventListener (Event.COMPLETE,onCompleted);
8 file.addEventListener(ProgressEvent.PROGRESS,onProgress);
9 }
这三个事件处理函数的详细定义如下(其中的stateText为String的变量,用于显示文件上传状态提示):1 internal function onSelected(evt:Event):void
2 {
3 stateText = "选择了文件" + file.name;
4 }
5
6 internal function onCompleted(evt:Event):void
7 {
8 stateText = "上传完毕!";
9 }
10
11 internal function onProgress(evt:ProgressEvent):void
12 {
13 stateText = "已上传 " + Math.round(100 * evt.bytesLoaded / evt.bytesTotal) + "%";
14 }
到这里客户端就只差一步了,那就是完成发起上传请求的方法,实际上就是通过URLRequest对象创建一个与服务端的连接,然后直接调用 FielReference类的upload()方法就可完成该功能,详细如下代码定义:1 /**
2 * 调用FileReference的实例方法upload()实 现文件上传
3 * */
4 internal function onUpLoad():void
5 {
6 if(file.size > 0)
7 {
8 stateText = "正在上传文件:" + file.name;
9 }
10 var request:URLRequest = new URLRequest();
11 request.url="http://localhost/Web/UpLoadHandler.ashx";
12 file.upload(request);
13 }