Flex2.0实现文件上传功能（服务器为ASP.NET）

简介：
新的Flex2.0类库里提供了文件类，方便了上传/下载文件。下面的程序demo演示了Flex2.0生成flash来访问本地文件，在flash里上传用户选择的文件到服务器，flash客户端可以处理文件上传进度等多个事件，服务器端是C#写的文件接收模块，把用户上传的文件保存在服务器上。
Demo演示了ProgressEventType.PROGRESS, EventType.SELECT 2个事件的处理方法。

测试效果：

测试环境：

操作系统：windows2003 Server
Flex版本：Flex 2.0 Alpha 1
Flash版本： flash Player 8.5
WEB服务器：
IIS 6.0
.net FrameWork 1.1

客户端代码：FileUpload.mxml

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.macromedia.com/2005/mxml"

xmlns="*" creationComplete="init();">

<mx:Script>

<![CDATA[

import flash.net.FileReference;

import mx.controls.Alert;

import mx.events.AlertClickEvent;

import flash.events.*;

var file:FileReference;

private function init(){

Security.allowDomain("*");

file = new FileReference();

file.addEventListener(ProgressEventType.PROGRESS, onProgress);

file.addEventListener(EventType.SELECT, onSelect);

}

private function upload(){

file.browse();

}

private function onSelect(e:Event){

Alert.show("上传 " + file.name + " (共 "+Math.round(file.size)+" 字节)?",

"确认上传",

Alert.YES|Alert.NO,

null,

proceedWithUpload);

}

private function onProgress(e:ProgressEvent){

lbProgress.text = " 已上传 " + e.bytesLoaded

+ " 字节，共 " + e.bytesTotal + " 字节";

}

private function proceedWithUpload(e:AlertClickEvent){

if (e.detail == Alert.YES){

file.upload("http://localhost/JZService/WebForm1.aspx");

}

]]>

</mx:Script>

<mx:Canvas width="100%" height="100%">

<mx:VBox width="100%" horizontalAlign="center">

<mx:Label id="lbProgress" text="上传"/>

<mx:Button label="上传文件" click="upload();"/>

</mx:VBox>

</mx:Canvas>

</mx:Application>

服务端代码：WebForm1.aspx

private void Page_Load(object sender, EventArgs e) {

// 在此处放置用户代码以初始化页面

HttpFileCollection uploadedFiles = Request.Files;

string Path = Server.MapPath("data");

for(int i = 0 ; i < uploadedFiles.Count ; i++) {

HttpPostedFile F = uploadedFiles[i];

if(uploadedFiles[i] != null && F.ContentLength > 0) {

string newName = F.FileName.Substring(F.FileName.LastIndexOf("\\") + 1);

F.SaveAs(Path + "/" + newName);

}

posted @ 2006-01-19 16:17 dannyr|一个都不能少！阅读(4074) 评论(17) 编辑收藏网摘所属分类: Flex技术、.Net技术

发表评论

回复引用查看

#1楼 2006-01-19 17:30 | C# hack

一直关注flex,希望有天能够用上！

回复引用查看

#2楼 2006-01-20 08:06 | 兰亭

终于能够上传了，呵呵

回复引用查看

#3楼 2006-01-22 13:30 | LiuX的专栏

老兄,服务器为ASP.NET,是怎么配置的?请指教

回复引用查看

#4楼 [楼主]2006-02-06 10:55 | dannyr|一个都不能少！

不用什么特别的配置的！

回复引用

#5楼 2006-02-07 09:46 | usherlight [未注册用户]

看Flex的文档，一般都是使用Tomcat的。 HttpService也是和Jsp结合使用的。
与aspx的结合使用以前没有看到过，Danny兄是如何实现的呢？

回复引用查看

#6楼 [楼主]2006-02-07 13:41 | dannyr|一个都不能少！

不知道usherlight兄是否用过ASP.NET，HttpService就是通过HTTP协议来通讯并传递数据，而JSP、ASPX都可以实现，二者没啥差别，都遵循HTTP的规范就可以了。

回复引用

#7楼 2006-02-08 09:32 | usherlight [未注册用户]

有一些明白了. 多谢Danny兄.

回复引用

#8楼 2006-03-30 16:09 | 对对飞 [未注册用户]

<mx:Script>
<![CDATA[

import flash.net.FileReference;
import mx.controls.Alert;
import mx.events.CloseEvent;
import flash.events.*;

public var file:FileReference;

private function init():void{
//var file:FileReference;
Security.allowDomain("*");
file = new FileReference();
file.addEventListener(ProgressEvent.PROGRESS, onProgress);
file.addEventListener(Event.SELECT, onSelect);

}

private function upload():void{
file.browse();
}

private function onSelect(e:Event):void{
Alert.show("上传 " + file.name + " (共 "+Math.round(file.size)+" 字节)?",
"确认上传",
Alert.YES|Alert.NO,
null,
proceedWithUpload);
}

private function onProgress(e:ProgressEvent):void{
lbProgress.text = " 已上传 " + e.bytesLoaded
+ " 字节，共 " + e.bytesTotal + " 字节";
}

private function proceedWithUpload(e:CloseEvent):void{
if (e.detail == Alert.YES){
file.upload("http://localhost/WebApplication1/WebForm1.aspx");
}
}

]]>
</mx:Script>

回复引用

#9楼 2006-03-31 15:06 | 梁 [未注册用户]

为什么我找不到AlertClickEvent???

回复引用查看

#10楼 [楼主]2006-04-03 15:30 | dannyr|一个都不能少！

没用到 AlertClickEvent 事件啊！
直接使用Alert.show()的回调函数proceedWithUpload()

回复引用

#11楼 2006-04-10 10:28 | 对对飞 [未注册用户]

@梁
flex已经更新了要改一些事件的名字

回复引用查看

#12楼 [楼主]2006-04-10 21:42 | dannyr|一个都不能少！

嗯！ Flex 从Alphi到Beta 2 SDK的API改了很多！