如何在asp.net(c#)开发中使用文件上传组件uploadify(带进度条)

在Web开发中，可以上传的组件模块很多，使用HTML File控件上传也是一种方法，但是这种方法需要处理的细节比较多，只能支持单文件操作。目前，它被广泛应用于网络开发，uploadify(参考http://www.uploadify.com/)可能就是其中之一。但是这个版本在不断的变化，他们的脚本调用也有很大的不同。甚至呼叫和参数也在不断变化。在很早的时候，Flash的按钮文本是无法更改的。本文主要结合实际项目介绍uploadify版本的控制使用。这个版本还是最新的，所以对我们来说是一个Web。这个控件有很多参数控制和事件处理响应，相对来说比较好用。参数控制可以控制上传文件、文件类型、文件大小、文件数量的多选，检查文件是否存在，控制一些按钮参数，如文字、高度、宽度等。可以控制文件是否提交成功、完成操作、取消和停止上传等。他们的帮助文档也写得很好，但是不同版本的方法参数完全不同，但是控件是一个很好的控件。若要使用该控件，必须首先加入必要的脚本类库。因为控件利用了Jquery的功能，所以还需要应用Jquery脚本文件，如下所示。复制了以下代码： script src=' http://www.jb51.net/jquery/jquery-1.8.0.min.js'类型=' text/JavaScript '/script script src=' http://www.jb51.net/jquerytools/上传/jquery . Upload-3.1 . min . js ' type=' text/JavaScript '/script link href='//www . JB 51 . net/jquerytols/Upload/Upload . CSS ' rel='样式表' type=' text/CSS'/。复制代码如下：脚本语言=' JavaScript '类型=' text/JavaScript ' $(function(){ var guid=' %=request[' guid ']% '；var类型=' %=请求[' type ']% '；if(guid==null | | guid==' '){ guid=new guid()；} if(键入！=null){ type=type '/'；} $ ('# file _ upload ')。uploadify({ ' swf ' : ' uploadify . swf '，//flash文件路径' buttonText':' browse '，//button text ' uploader ' : ' uploadhandler . ashx？Guid=' guid，//处理ASHX页' form data ' : { ' folder ' : ' picture ' }，//传递参数' queueID': 'fileQueue '，//队列ID 'queueSizeLimit': 10，//队列中可以上传的最大文件数默认为999' auto' : false。//默认值为true' multi' 3360 true。//如果选择了多个文件，默认值为true“删除已完成”3360 true。//完成后删除序列。默认值为true“文件大小限制”:“10mb”。//单个文件大小，0不限，字符串值为KB、MB、GB等。可以接受“filetypedesc”:“图像文件”。//文件描述' fileTypeExts ' : ' *。gif*.jpg*.巴布亚新几内亚；*.bmp '，//上传文件后缀过滤器' onqueuecomplete' :函数(event，data){//队列完成后的所有事件//show upfiles (guid，type，show _ div)；警报('上传完成！' );}、“onuploadererror”:函数(事件、queueId、fileObj、error obj){ alert(error obj . type):“error obj . info”；} });});函数NewGuid(){ var guid=' '；for(var I=1；i=32I){ var n=math . floor(math . random()* 16.0)。toString(16)；guid=n；if((I==8)| | |(I==12)| |(I==16)| |(I==20))guid='-'；}返回guid} /script再说一遍，这个控件请不要参考其他在线说明，否则参数和用法可能不正确，所以请找对应版本的说明(本文参考3.1.1)，最好参考这个版本的在线文档。以上参数我基本都评论过了，还有一些不是很重要的参数，这里就不一一列举了。请参考在线文档。值得一提的是，这个版本可以在Flash中修改文字，非常不错。我讨厌以前默认浏览的英文。虽然之前可以修改文字代替图片，但还是不太好用。这直接修改了文字，非常好。

值得注意的是uploader参数，它是我们的ashx的后台处理器，也就是说，控件将文件提交到那个页面进行保存处理，并添加数据库记录。

页面代码使用很简单，如下所示复制代码代码如下：正文样式=' margin-left :10 px；margin-top :10 px ' form id=' form 1 ' runat=' server ' enctype=' multipart/form-data ' div id=' fileQueue ' class=' fileQueue '/div输入类型=' file ' name=' file _ upload ' id=' file _ upload '/p输入类型=' button ' class=' short button ' id=' btnUpload ' onclick=' JavaScript : $(' # file _ upload ').uploadify('上传'，' * ')值='上传/input type=' button ' class=' short button ' id=' btncanceluload ' onclick=' JavaScript : $(' # file _ upload ').uploadify(' cancel ')"value="取消//p div id=' div _ show _ files '/div/div/窗体/正文关键是后台上传文件的保存操作了，asp.net一般采用ashx的处理页面来处理。复制代码代码如下：///summary ///文件上传后台处理页面////摘要[WebServiCe(NameSpace=' http://tempuri。org/')][WebServiceBinding(CONFOrmSTO=WSiprofiles .base cprofile 1 _ 1)]公共类UploadHandler : IHttpHandler { public void process request(HttpContext context){ context .响应。内容类型='文本/纯文本；语境回应。charset=' utf-8 '；请尝试{字符串guid=上下文.请求。查询字符串[' guid ']；字符串文件夹=上下文。请求['文件夹'];//LogTextHelper .信息（文件夹);HttpPostedFile文件=上下文。请求文件['文件数据'];如果(文件！=null) {字符串oldFileName=文件.文件名；//原文件名int大小=文件ContentLength//附件大小字符串扩展名=旧文件名。子字符串（旧文件名. LastIndexOf('。') 1);//后缀名字符串新文件名=获取新文件名(旧文件名);//生成新文件名//LogTextHelper .信息（新文件名);#地区上传到远程服务器//文件服务器页面fsw=新文件服务器页面();//字符串uploadFilePath='/'新文件名；//if(！字符串IsNullOrEmpty(文件夹))//{ //uploadFilePath=string .格式('/{0}/{1} ',文件夹，新文件名);//} //bool上传=fsw .上传文件（文件输入流，'/'文件夹/'新文件名)；# endregion #区域本地服务器上传AppConfig config=new AppConfig()；字符串上传文件=配置.AppConfigGet(' uploadFiles ')；如果(字符串IsNullOrEmpty(uploadFiles)){ uploadFiles=' uploadFiles '；} if(！字符串IsNullOrEmpty(文件夹)){上传文件=路径。组合（上传文件，文件夹);}字符串上传路径=路径。组合(HttpContext .当前。Server.MapPath('/')、uploadFiles)；if(！目录。存在（上传路径)){目录。创建目录（上传路径);}字符串新文件路径=路径。组合（上传路径，新文件名);日志文本助手.信息（新文件路径);文件。另存为（新文件路径);弯曲件上传=文件。存在（新文件路径);#endregion if(上传){ #地区文件保存成功后，写入附件的数据库记录//AttachmentInfo AttachmentInfo=new AttachmentInfo()；//附件信息.编辑时间=日期时间.现在；//附件信息.file extend=extension/attachmentInfo .文件名=文件夹“/”新文件名；//附件信息.旧文件名=旧文件名；//附件信息.大小=大小；//附件信息.Guid=guid//bllfactryattachment .实例。插入（附件信息);#endregion } } else { LogTextHelper .错误('上传文件失败');} } catch(Exception ex){ LogTextHelper .错误('上传文件失败，ex)；扔；} } ///摘要///获取新的名称比如：aa.jpg转化为aa(20090504).jpg////summary///param name=' fileName '文件名称[aa.jpg]/param ///returns新的文件名称/返回公共静态字符串GetNewFileName(字符串文件名){ if(字符串IsNullOrEmpty(fileName))返回字符串。空的；//文件后缀名字符串扩展名=fileName .子字符串(文件名.LastIndexOf(' . ') 1);字符串名称=fileName .子字符串(0,文件名. LastIndexOf(' . '))"(“日期时间.现在。ToFileTime()')'；字符串新文件名=名称"."扩展；返回新文件名；} public bool IsReuse { get { return false；} } }