使用 Flex 上传文件

mirycat 楼主

教程很简单, 先看看演示
http://kakera.35818.net/uploadsample/

客户端, 只有 1 个 mxml, 看注释就明
UploadSample.mxml

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" horizontalAlign="center"> <mx:Style> global { fontSize : 12; } </mx:Style> <mx:Script> <![CDATA[ // 先搞 1 个 FileReference private var file:FileReference = new FileReference(); // 上传状态指示, 和下面的文本框绑定 [Bindable] private var stateText:String = "请选择一个文件上传"; // createChildren 比 creationComplete 事件更早发生, 省的注册事件侦听, 直接在这里写了 protected override function createChildren():void { super.createChildren(); file.addEventListener(Event.SELECT, file_select); file.addEventListener(Event.COMPLETE, file_complete); file.addEventListener(ProgressEvent.PROGRESS, file_progress); } // 选择 1 个文件的事件 private function file_select (e:Event):void { stateText = "选择了文件 " + file.name; } // 上传完毕后的事件 private function file_complete (e:Event):void { stateText = "上传完毕"; } private function file_progress (e:ProgressEvent):void { stateText = "已上传 " + Math.round(100 * e.bytesLoaded / e.bytesTotal) + "%"; } // 先判断一下文件大小, 再上传, FileService.aspx 就是上传地址 private function upload ():void { if (file.size > 0) { stateText = "正在上传 " + file.name; var request:URLRequest = new URLRequest("FileService.aspx"); file.upload(request); } } ]]> </mx:Script> <mx:Panel width="250" height="112" layout="vertical" title="上传示例" verticalAlign="middle" horizontalAlign="center" > <mx:HBox> <mx:TextInput text="{stateText}" width="160" editable="false"/> <mx:Button label="浏览" click="file.browse();"/> </mx:HBox> <mx:HBox> <mx:Button label="上传" click="upload();"/> </mx:HBox> </mx:Panel> </mx:Application>

运行代码 复制代码 另存代码  提示：您可以先修改部分代码再运行

服务端, 使用 .net 制作, 看注释就明白,
看不懂的话也没关系只要知道文件上传到 upload 文件夹里就可以了 (要事先创建好), 文件名不变
FileService.aspx

<script language="C#" runat="server"> string uploadFolder = "upload"; // 上传文件夹 private void Page_Load(object sender, System.EventArgs e) { HttpFileCollection files = Request.Files; if (files.Count == 0) { Response.Write("请勿直接访问本文件"); Response.End(); } string path = Server.MapPath(uploadFolder); // 只取第 1 个文件 HttpPostedFile file = files[0]; if (file != null && file.ContentLength > 0) { // flash 会自动发送文件名到 Request.Form["fileName"] string savePath = path + "/" + Request.Form["fileName"]; file.SaveAs(savePath); } } </script>

运行代码 复制代码 另存代码  提示：您可以先修改部分代码再运行

控制上传时间和文件大小就得靠这个
其中 maxRequestLength 是最大上传文件大小, 单位是 k, 4096 也就是允许上传 4M 的文件, 这也是默认值
executionTimeout 是上传文件的超时判断, 上传大文件时记得设的大一些
web.config

<?xml version="1.0" encoding="utf-8"?> <configuration> <system.web> <httpRuntime maxRequestLength="4096" executionTimeout="10000" /> </system.web> </configuration>

运行代码 复制代码 另存代码  提示：您可以先修改部分代码再运行

hubro

晕,才发现是FALSH的

[ 本帖最后由 hubro 于 2006-11-9 13:14 编辑 ]

huxw

楼主 是否有java对应的代码 ，谢谢！

snhczaw

太棒了，正在学习中，谢谢

sayhelen

flex～  学习～

kennyshaw

好东西，第一次接触FLEX

resun

好东西呀!收藏了,呵呵,谢谢楼主

cc1007

楼主，我按照你的做了之后出现这样的情况是什么原因？

Error #2044: 未处理的 IOErrorEvent:。 text=Error #2038: 文件 I/O 错误。
        at uploadbeta$iinit()
        at _uploadbeta_mx_managers_SystemManager/create()
        at mx.managers::SystemManager/::initializeTopLevelWindow()
        at mx.managers::SystemManager/::docFrameHandler()

xiangliang

看了真养眼

longmeng2008

一定要学习！

noahgenius

我也做过，感觉有两个比较难搞的地方：

1 上传进度：某些防火墙可以干扰上传，防火墙先接收上传数据，然后再上传，导致flash很快就到了100%但是还要等一段时间才结束
2 无法返回上传后的信息（据说最新版flash player提供了这个功能）

afternoon

我在本地测试。点了upload按钮后。会弹出登录框，登录后就没动静了~~。检查文件没有上传成功~我找了其他代码flash版本的，测试同样现象。。
测试环境 window2003 SP2 + Flex2.01/Flash cs3 + Flashplayer 9 + .net3.0

[ 本帖最后由 afternoon 于 2007-5-10 16:23 编辑 ]