• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号
登陆 注册

在ASP.NET中利用SlickUpload来上传大文件

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

http://blog.csdn.net/zhoufoxcn/article/details/5765748

http://blog.csdn.net/zhoufoxcn/article/details/5772351 续

 

 

SlickUpload的介绍
 最近在看《ASP.NET MVC2 IN ACTION》英文版时发现里面介绍到一个在ASP.NET中上传大文件的ASP.NET控件，叫SlickUpload，软件的介绍下载和介绍网址是：http://krystalware.com/Products/SlickUpload/。
 我们知道，在ASP.NET中对于上传文件可以利用FileUpload控件或者<input type="file" name="file"/>这样的方式就可以上传，但是利用这样的方式上传存在一些缺点，比如默认一次只能上传一个文件及上传的文件的大小也有限制，除此之外，利用这种方式上传不能以直观的方式显示上传的进度情况，于是有了各种各样的第三方解决方案，比如SWFUpload等。不过因为在最近的版本中ADOBE公司增强了权限控制，所以SWFUpload也有些不太灵光了，这里介绍另外一种文件上传控件SlickUpload。SlickUpload是一款共享软件，它的购买地址是http://krystalware.com/purchase/，如果公司有经常上传超大文件需求的，不妨购买。
 SlickUpload的原理如下图：

 

 可以看出它的处理流程如下：
 对于请求中的每个文件SlickUpload都会调用定义好的上传文件流供应者来写文件数据，SlickUpload支持两种内置的文件处理方式和用户自定义的处理方式：
 文件系统，即将文件保存到服务器文件下；
 SQL，即将文件保存到SQL服务器中；
 根据用户逻辑的自定义方式；
 SlickUpload可以在ASP.NET WebForm和ASP.NET MVC及ASP.NET AJAX项目中运行，可以以带进度显示上传超过上G的文件。
 在不同环境下最大可支持上传的文件大小：
 IIS 5：最大可支持上传2 GB
 IIS 6：最大支持上传4 GB
 IIS 7传统模式：最大支持上传4 GB
 IIS 7 集成模式：最大支持上传2 GB
 VS.NET集成WebDev server环境下：最大支持2 GB
 当然上面的最大支持需要在web.config文件中的<httpRuntime>节点的maxRequestLength属性。

 

SlickUpload的安装
1.程序集的安装
 首先请将Krystalware.SlickUpload.dll拷贝到Web项目的bin目录下，这个程序集包含了SlickUpload的HttpModule模块。
2.添加SlickUpload控件到VS的控件工具箱（周公的VS版本为VS2008SP1)
 步骤如下：
 2.1用VS打开Web项目或者包含Web项目的解决方案。
 2.2在VS上的控件箱空白处鼠标右键点击，选择“选择项”，出现如下图所示的界面：
 
2.3在打开的对话框中选择“浏览”，如下图所示：

找到Krystalware.SlickUpload.dll所在的位置，然后点击确定，这样就完成了将SlickUpload添加到控件箱。如下图所示：

3.在web.config中配置
3.1配置configSections节点
打开web.config文件找到configSections节点（如果没有的话请在<configuration>元素下添加），在configSections节点下添加如下内容：

 

 

  1. <sectionGroup name="slickUpload">   
  2.     <section name="uploadParser" type="Krystalware.SlickUpload.Configuration.NameValueConfigurationSectionHandler, Krystalware.SlickUpload" />   
  3.     <section name="uploadStreamProvider" type="Krystalware.SlickUpload.Configuration.NameValueConfigurationSectionHandler, Krystalware.SlickUpload" />   
  4.     <section name="statusManager" type="Krystalware.SlickUpload.Configuration.StatusManagerConfigurationSectionHandler, Krystalware.SlickUpload" />   
  5. </sectionGroup>  

 

添加slickUpload节点

在<configuration>元素下添加slickUpload节点，如下：

 

 

  1. <slickUpload>   
  2.     <uploadStreamProvider location="~/Files" existingAction="Overwrite" />   
  3. </slickUpload>  

 

其中的location表示文件上传后的存放位置，existingAction表示如果在服务端已经存在同名文件如何处理。
system.web/httpModules节点配置
在system.web节点下添加如下内容：

 

 

  1. <httpModules>   
  2.     <add name="HttpUploadModule" type="Krystalware.SlickUpload.HttpUploadModule, Krystalware.SlickUpload" />   
  3. </httpModules>  

 

如果在web.config中已经存在system.web/httpModules节点，则只需将<add ..../>部分添加到这个节点下即可。
system.web/httpHandlers节点配置
在system.web节点下添加如下内容：

 

 

  1. <httpHandlers>   
  2.     <add path="SlickUpload.axd" verb="GET,POST" type="Krystalware.SlickUpload.SlickUploadHandler, Krystalware.SlickUpload" />   
  3. </httpHandlers>  

 

如果在web.config中已经存在system.web/httpModules节点，则只需将<add ..../>部分添加到这个节点下即可。
system.web/httpRuntime节点配置
在system.web节点下添加如下内容：

 

 

  1. <httpRuntime  maxRequestLength="1024000"  executionTimeout="600" />  

 

以上配置表示允许最大上传1GB的文件（maxRequestLength的单位为MB)，程序执行超时时间为10分钟(executionTimeout的单位为秒）。
经过如下配置之后就可以在我们的ASP.NET项目中使用SlickUpload项目了。

SlickUpload的使用

快速上手指南
下面是一个简单使用的例子，代码如下：

 

view plaincopy to clipboardprint?
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="SlickUploadQuickStart.aspx.cs" Inherits="SlickUploadQuickStart" %>  
  2.   
  3. <%@ Register assembly="Krystalware.SlickUpload" namespace="Krystalware.SlickUpload.Controls" tagprefix="kw" %>  
  4.   
  5. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  6.   
  7. <html xmlns="http://www.w3.org/1999/xhtml">  
  8. <head runat="server">  
  9.     <title>SlickUpload Quick Start</title>  
  10.     <mce:script type="text/javascript"><!--  
  11.     function cancelUpload() {  
  12.         kw.get("<%=SlickUpload1.ClientID %>").cancel();  
  13.     }       
  14. // --></mce:script>  
  15. </head>  
  16. <body>  
  17.     <h1>SlickUpload Quick Start</h1>  
  18.     <form id="form1" runat="server">  
  19.           
  20.     <kw:SlickUpload ID="SlickUpload1" runat="server" ShowDuringUploadElements="cancelButton"   
  21.         onuploadcomplete="SlickUpload1_UploadComplete" Width="480px">  
  22.         <downlevelselectortemplate>  
  23.             <input type="file" />  
  24.         </downlevelselectortemplate>  
  25.         <uplevelselectortemplate>  
  26.             <input type="button" value="选择文件" />  
  27.         </uplevelselectortemplate>  
  28.         <filetemplate>  
  29.             <kw:FileListRemoveLink runat="server">  
  30.                 [x] 删除</kw:FileListRemoveLink>  
  31.             <kw:FileListFileName runat="server" />  
  32.             <kw:FileListValidationMessage runat="server" ForeColor="Red" />  
  33.         </filetemplate>  
  34.         <progresstemplate>  
  35.             <table width="100%">  
  36.                 <tr>  
  37.                     <td>  
  38.                         文件上传中  
  39.                         <kw:UploadProgressElement runat="server" Element="FileCountText">  
  40.                         </kw:UploadProgressElement>  
  41.                         ,  
  42.                         <kw:UploadProgressElement runat="server" Element="ContentLengthText">  
  43.                             (calculating)</kw:UploadProgressElement>  
  44.                         .  
  45.                     </td>  
  46.                 </tr>  
  47.                 <tr>  
  48.                     <td>  
  49.                         当前正在上传:  
  50.                         <kw:UploadProgressElement runat="server" Element="CurrentFileName">  
  51.                         </kw:UploadProgressElement>  
  52.                         , 进度  
  53.                         <kw:UploadProgressElement runat="server" Element="CurrentFileIndex">  
  54.                              </kw:UploadProgressElement>  
  55.                         /  
  56.                         <kw:UploadProgressElement runat="server" Element="FileCount">  
  57.                         </kw:UploadProgressElement>  
  58.                         .  
  59.                     </td>  
  60.                 </tr>  
  61.                 <tr>  
  62.                     <td>  
  63.                         上传速度:  
  64.                         <kw:UploadProgressElement runat="server" Element="SpeedText">  
  65.                             (calculating)</kw:UploadProgressElement>  
  66.                         .  
  67.                     </td>  
  68.                 </tr>  
  69.                 <tr>  
  70.                     <td>  
  71.                         估计剩余时间：  
  72.                         <kw:UploadProgressElement runat="server" Element="TimeRemainingText">  
  73.                             (calculating)</kw:UploadProgressElement>  
  74.                     </td>  
  75.                 </tr>  
  76.                 <tr>  
  77.                     <td>  
  78.                         <div style="border:1px solid #008800;height:1.5em;position:relative">  
  79.                             <kw:UploadProgressBarElement runat="server"   
  80.                                 style="background-color:#00ee00;width:0;height:1.5em">  
  81.                             </kw:UploadProgressBarElement>  
  82.                             <div style="text-align:center;position:absolute;top:.15em;width:100%">  
  83.                                 <kw:UploadProgressElement runat="server" Element="PercentCompleteText">  
  84.                                     (calculating)</kw:UploadProgressElement>  
  85.                             </div>  
  86.                         </div>  
  87.                     </td>  
  88.                 </tr>  
  89.             </table>  
  90.         </progresstemplate>  
  91.     </kw:SlickUpload>  
  92.           
  93.     <hr />  
  94.         <asp:Button ID="Button1" runat="server" Text="上传" />  
  95.          <asp:Button ID="cancelButton" runat="server"   
  96.             onclientclick="cancelUpload();return false;" Text="Cancel" style="display:none" mce_style="display:none" />  
  97.         <br />  
  98.         <br />  
  99.         <asp:Label ID="uploadResult" runat="server"></asp:Label>  
  100.         <asp:Repeater ID="uploadFileList" runat="server" EnableViewState="False">  
  101.             <FooterTemplate></ul></FooterTemplate>  
  102.             <ItemTemplate><li><%# DataBinder.Eval(Container.DataItem, "ClientName") %></li></ItemTemplate>  
  103.             <HeaderTemplate><ul></HeaderTemplate>  
  104.         </asp:Repeater>  
  105.     </form>  
  106. </body>  
  107. </html>  

 

后台的代码如下：

 

view plaincopy to clipboardprint?
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.Web.UI;  
  6. using System.Web.UI.WebControls;  
  7.   
  8. using Krystalware.SlickUpload;//添加引用   
  9. using Krystalware.SlickUpload.Status;//添加引用   
  10.   
  11. public partial class SlickUploadQuickStart : System.Web.UI.Page  
  12. {  
  13.     protected void Page_Load(object sender, EventArgs e)  
  14.     {  
  15.   
  16.     }  
  17.     protected void SlickUpload1_UploadComplete(object sender, Krystalware.SlickUpload.Controls.UploadStatusEventArgs e)  
  18.     {  
  19.         uploadResult.Text = "上传结果: " + e.Status.State;  
  20.   
  21.         if (e.Status.State == UploadState.Terminated)  
  22.             uploadResult.Text += ". 原因: " + e.Status.Reason;  
  23.   
  24.         if (e.Status.State != UploadState.Terminated)  
  25.         {  
  26.             uploadFileList.DataSource = e.UploadedFiles;  
  27.             uploadFileList.DataBind();  
  28.         }  
  29.     }  
  30. }  

 

运行这个页面会看到如下效果：

点击上传按钮会看到如下效果：

注意，如果上传的文件超过在web.config中配置的最大允许大小会上传失败，看到的界面如下：

如果上传成功，则会看到下面的界面：


在ASP.NET AJAX中使用SlickUpload
在ASP.NET项目中新建一个ASPX页面，代码如下：

 

view plaincopy to clipboardprint?
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="SlickUploadAjax.aspx.cs" Inherits="SlickUploadAjax" %>  
  2. <%@ Register Assembly="Krystalware.SlickUpload" Namespace="Krystalware.SlickUpload.Controls"  
  3.     TagPrefix="kw" %>  
  4. <%@ Import Namespace="Krystalware.SlickUpload" %>  
  5. <%@ Import Namespace="Krystalware.SlickUpload.Status" %>  
  6. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  7.   
  8. <html xmlns="http://www.w3.org/1999/xhtml">  
  9. <head runat="server">  
  10.     <title>SlickUpload ASP.NET AJAX Sample</title>  
  11.     <mce:script type="text/javascript"><!--  
  12.         function startUpload()  
  13.         {  
  14.             kw.get('<%=SlickUpload1.ClientID %>').submit();  
  15.         }  
  16.       
  17. // --></mce:script>   
  18. </head>  
  19. <body>  
  20.     <h1>SlickUpload ASP.NET AJAX Sample</h1>  
  21.     <form id="Form1" runat="server">  
  22.         <asp:ScriptManager ID="ScriptManager" runat="server" EnablePartialRendering="true">  
  23.         </asp:ScriptManager>                 
  24.         <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">  
  25.             <ContentTemplate>  
  26.                 <div style="border:2px dotted #ccc;padding:1em;width=500px">  
  27.                     <h2>UpdatePanel</h2>  
  28.                     <p>时间: <asp:Label ID="updateLabel" runat="server" /></p>  
  29.                     <p><asp:Button ID="updateButton" runat="server" Text="更新时间"   
  30.                             onclick="updateButton_Click" /></p>  
  31.                     <h2>选择文件</h2>  
  32.                     <asp:Panel ID="uploadPanel" runat="server">  
  33.                         <kw:SlickUpload ID="SlickUpload1" runat="server" AutoUploadOnPostBack="false" ShowDuringUploadElements="cancelButton" HideDuringUploadElements="uploadButton" OnUploadComplete="SlickUpload1_UploadComplete">  
  34.                             <DownlevelSelectorTemplate>  
  35.                                 <input type="file" />  
  36.                             </DownlevelSelectorTemplate>  
  37.                             <UplevelSelectorTemplate>  
  38.                                 <input type="button" value="添加文件" />  
  39.                             </UplevelSelectorTemplate>  
  40.                             <FileTemplate>  
  41.                                 <kw:FileListRemoveLink ID="FileListRemoveLink1" runat="server">  
  42.                                     [x] 删除文件</kw:FileListRemoveLink>  
  43.                                 <kw:FileListFileName ID="FileListFileName1" runat="server" />  
  44.                                 <kw:FileListValidationMessage ID="FileListValidationMessage1" runat="server" ForeColor="Red" />  
  45.                             </FileTemplate>  
  46.                             <ProgressTemplate>  
  47.                                 <table width="100%">  
  48.                                     <tr>  
  49.                                         <td>  
  50.                                             文件上传中  
  51.                                             <kw:UploadProgressElement ID="UploadProgressElement1" runat="server" Element="FileCountText">  
  52.                                             </kw:UploadProgressElement>  
  53.                                             ,  
  54.                                             <kw:UploadProgressElement ID="UploadProgressElement2" runat="server" Element="ContentLengthText">  
  55.                                                 (calculating)</kw:UploadProgressElement>  
  56.                                             .  
  57.                                         </td>  
  58.                                     </tr>  
  59.                                     <tr>  
  60.                                         <td>  
  61.                                             当前正在上传:  
  62.                                             <kw:UploadProgressElement ID="UploadProgressElement3" runat="server" Element="CurrentFileName">  
  63.                                             </kw:UploadProgressElement>  
  64.                                             , 进度  
  65.                                             <kw:UploadProgressElement ID="UploadProgressElement4" runat="server" Element="CurrentFileIndex">  
  66.                                                  </kw:UploadProgressElement>  
  67.                                             /  
  68.                                             <kw:UploadProgressElement ID="UploadProgressElement5" runat="server" Element="FileCount">  
  69.                                             </kw:UploadProgressElement>  
  70.                                             .  
  71.                                         </td>  
  72.                                     </tr>  
  73.                                     <tr>  
  74.                                         <td>  
  75.                                             上传速度:  
  76.                                             <kw:UploadProgressElement ID="UploadProgressElement6" runat="server" Element="SpeedText">  
  77.                                                 (calculating)</kw:UploadProgressElement>  
  78.                                             .  
  79.                                         </td>  
  80.                                     </tr>  
  81.                                     <tr>  
  82.                                         <td>  
  83.                                             预计剩余上传时间：  
  84.                                             <kw:UploadProgressElement ID="UploadProgressElement7" runat="server" Element="TimeRemainingText">  
  85.                                                 (calculating)</kw:UploadProgressElement>  
  86.                                               
  87.                                         </td>  
  88.                                     </tr>  
  89.                                     <tr>  
  90.                                         <td>  
  91.                                             <div style="border: 1px solid #008800; height: 1.5em; position: relative">  
  92.                                                 <kw:UploadProgressBarElement ID="UploadProgressBarElement1" runat="server" Style="background-color: #00ee00;  
  93.                                                     width: 0; height: 1.5em" mce_Style="background-color: #00ee00;  
  94. ">  
  95.                                                 </kw:UploadProgressBarElement>  
  96.                                                 <div style="text-align: center; position: absolute; top: .15em; width: 100%">  

鲜花
握手
雷人
路过
鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
More+
上一篇：
用ASP.NET将网页错误信息写入系统日志发布时间：2022-07-10
下一篇：
asp.net生成缩略图发布时间：2022-07-10
热门推荐
More+
热门话题
More+
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服（服务时间 9:00～18:00）

在线QQ客服
地址：深圳市南山区西丽大学城创智工业园
电邮：jeky_zhao#qq.com
移动电话：139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap