Flex2.0文件上传功能（Flex2.0正式版）

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

        顺便提一下关于JSP的接收Flex上传文件的方法（很多网友问过这个问题），我建议使用Jakarta Commons FileUpload的文件上传组件，详见：http://jakarta.apache.org/commons/fileupload/ ！

测试效果：

flexupload1.jpg


flexupload2.jpg

测试环境：

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


客户端代码：FileUpload.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    xmlns="*" creationComplete="init();">
    <mx:Script>
        <![CDATA[
            import flash.net.FileReference;
            import mx.controls.Alert;
            import mx.events.CloseEvent;
            import flash.events.*;

            private var file: FileReference;

            private function init(): void{
                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 + " 字节";
                var proc: uint = e.bytesLoaded / e.bytesTotal * 100;
                bar.setProgress(proc, 100);
                 bar.label= "当前进度: " + " " + proc + "%";
            }
            
            private function proceedWithUpload(e: CloseEvent): void{
                if (e.detail == Alert.YES){
                    var request: URLRequest = new URLRequest("http://localhost/JZService/WebForm1.aspx");
                    try {
                        file.upload(request);
                    } catch (error:Error) {
                        trace("上传失败");
                    }
                    
                }
            }
        ]]>
    </mx:Script>
    
    <mx:Canvas width="100%" height="100%">
        <mx:VBox width="100%" horizontalAlign="center">
            <mx:Label id="lbProgress" text="上传"/>
             <mx:ProgressBar id="bar" labelPlacement="bottom" themeColor="#F20D7A"
                minimum="0" visible="true" maximum="100" label="当前进度: 0%"  
                direction="right" mode="manual" width="200"/>
            <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-11-13 12:02 dannyr|一个都不能少！ 阅读(5579) 评论(10)  编辑 收藏 网摘 所属分类: Flex技术

  回复  引用  查看    
#1楼 2006-11-13 13:27 | anikin      
flash实现上传实时进度不难，能不能用Ajax实现?
  回复  引用  查看    
#2楼 2006-11-13 17:18 | U2U      
Flex真是Flexible
  回复  引用    
#3楼 2006-11-17 02:29 | 锦瑟 [未注册用户]
要用ajax实时显示进度比较困难，除非重写ms默认的那个upload接口
  回复  引用  查看    
#4楼 [楼主]2006-11-17 08:59 | dannyr|一个都不能少！      
Ajax实现上传进度条，网上有很多现成的控件，在google里用"ajax uploadfile"关键字搜索一下，有很多的！！！
  回复  引用  查看    
#5楼 [楼主]2006-11-17 09:05 | dannyr|一个都不能少！      
关键字可以改成：“ajax FileUpload”
  回复  引用    
#6楼 2007-04-04 13:25 | x_net [未注册用户]
你好，你有用过Fluorine的remoting吗。能否给个例子关于。NET通过remoting连接flex的，我试了好久没试出来。谢谢
  回复  引用    
#7楼 2007-10-02 18:46 | safe6 [未注册用户]
金融界英语Blog ：http://safe6.blog.hexun.com/

相册：http://safe6.photo.hexun.com/

祝福你，天天快乐！
  回复  引用    
#8楼 2007-11-08 16:37 | xiaohan [未注册用户]
请教一下，在flex2中能否用display控件实现播放实时视频的功能？比如播放网络摄像机正在监控的内容？谢谢！
  回复  引用    
#9楼 2008-03-09 21:17 | zjut12345 [未注册用户]
文件名为中文时候有没有试过？
  回复  引用    
#10楼 2008-06-15 11:55 | 老莫 [未注册用户]
AJAX实现也EASY
大文件的实时进度~
用SlickUpload的HttpModule，稍加改动
就能匹配你的Flex模块
标题  
姓名  
主页
Email (博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
网站首页

新闻频道

社区

小组

博问

网摘

人才

找找看
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      
该文被作者在 2006-11-13 12:36 编辑过
Google站内搜索


China-pub 计算机图书网上专卖店！6.5万品种 2-8折！
近千种 9-95 新二手计算图书火热销售中！

相关文章:

相关链接:

最新IT新闻:
Silverlight 2 SDK中文版发布
[译稿]微软将 jQuery IntelliSense整合到Visual Studio
微软：不裁员也不削减研发开支
2008年11月22日科技博客精选
诺基亚将支持Lotus Notes 和黑莓争夺市场