ASP.NET 上传大文件之SlickUpload
2010-09-26 16:04 czyhsl 阅读(894) 评论(1) 编辑 收藏 举报最近一直在查找上传大文件的方法，有关该方面的介绍网上也是数不胜数。意外中发现了SlickUpload，按照它提供的示例代码学习了下，感觉相当好用。大家可以到网上下载安装程序。
首先需要先把Krystalware.SlickUpload.dll添加到工具箱中。具体步骤如下：
1）在工具箱中点右键添加选项卡。如：SlickUpload
2)选中SlickUpload，右键选择 “选择项”
3）点击 “浏览”按钮，选择要添加的.dll文件，最后点“确定”。
4）简单看下工具箱中的SlickUpload选项卡，添加后的结果如下所示：
现在就可以开始使用这些控件了，首先新建一个Web程序，修改web.config，由于web.config中的内容比较多，一定要谨慎修改，我现在把要修改的几点陈列出来。
（1）配置configSections节点，在<configSections>添加
<sectionGroup name="slickUpload">
<section name="uploadParser" type="Krystalware.SlickUpload.Configuration.NameValueConfigurationSectionHandler, Krystalware.SlickUpload"/>
<section name="uploadStreamProvider" type="Krystalware.SlickUpload.Configuration.NameValueConfigurationSectionHandler, Krystalware.SlickUpload"/>
<section name="statusManager" type="Krystalware.SlickUpload.Configuration.StatusManagerConfigurationSectionHandler, Krystalware.SlickUpload"/>
</sectionGroup>
（2）在<configuration>节点下添加<slickUpload>节点
<slickUpload>
<uploadStreamProvider type="File" location="~/Files"/>
</slickUpload>
（3）在<system.web>/<httpHandlers>节点下配置
<add path="SlickUpload.axd" verb="GET,POST" type="Krystalware.SlickUpload.SlickUploadHandler, Krystalware.SlickUpload"/>
（4）在<system.web>/<httpModules>节点下配置
<add name="HttpUploadModule" type="Krystalware.SlickUpload.HttpUploadModule, Krystalware.SlickUpload"/>
（5）在<system.web>下添加
<httpRuntime maxRequestLength="1024000"/>
修改完毕后，再来看下页面方面的处理，首先拖一个SlickUpload,具体的页面内容如下：
代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="Krystalware.SlickUpload" Namespace="Krystalware.SlickUpload.Controls"
TagPrefix="kw" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>SlickUpload</title>
<script language="javascript" type="text/javascript">
function cancelUpload() {
kw.get("<%=SlickUpload1.ClientID %>").cancel();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<kw:SlickUpload ID="SlickUpload1" runat="server"
ShowDuringUploadElements="cancelButton" Width="480px"
onuploadcomplete="SlickUpload1_UploadComplete">
<DownlevelSelectorTemplate>
<input type="file" />
</DownlevelSelectorTemplate>
<UplevelSelectorTemplate>
<input type="button" value="选择文件" />
</UplevelSelectorTemplate>
<FileTemplate>
<kw:FileListRemoveLink ID="FileListRemoveLink1" runat="server">
[x] 删除</kw:FileListRemoveLink>
<kw:FileListFileName ID="FileListFileName1" runat="server" />
<kw:FileListValidationMessage ID="FileListValidationMessage1" runat="server" ForeColor="Red" />
</FileTemplate>
<ProgressTemplate>
<table width="100%">
<tr>
<td>
文件上传中
<kw:UploadProgressElement ID="UploadProgressElement1" runat="server" Element="FileCountText">
</kw:UploadProgressElement>
,
<kw:UploadProgressElement ID="UploadProgressElement2" runat="server" Element="ContentLengthText">
(calculating)</kw:UploadProgressElement>
.
</td>
</tr>
<tr>
<td>
当前正在上传:
<kw:UploadProgressElement ID="UploadProgressElement3" runat="server" Element="CurrentFileName">
</kw:UploadProgressElement>
, 进度
<kw:UploadProgressElement ID="UploadProgressElement4" runat="server" Element="CurrentFileIndex">
</kw:UploadProgressElement>
of
<kw:UploadProgressElement ID="UploadProgressElement5" runat="server" Element="FileCount">
</kw:UploadProgressElement>
.
</td>
</tr>
<tr>
<td>
上传速度:
<kw:UploadProgressElement ID="UploadProgressElement6" runat="server" Element="SpeedText">
(calculating)</kw:UploadProgressElement>
.
</td>
</tr>
<tr>
<td>
估计剩余时间：
<kw:UploadProgressElement ID="UploadProgressElement7" runat="server" Element="TimeRemainingText">
(calculating)</kw:UploadProgressElement>
</td>
</tr>
<tr>
<td>
<div style="border: 1px solid #008800; height: 1.5em; position: relative">
<kw:UploadProgressBarElement ID="UploadProgressBarElement1" runat="server" Style="background-color: #00ee00;
width: 0; height: 1.5em">
</kw:UploadProgressBarElement>
<div style="text-align: center; position: absolute; top: .15em; width: 100%">
<kw:UploadProgressElement ID="UploadProgressElement8" runat="server" Element="PercentCompleteText">
(calculating)</kw:UploadProgressElement>
</div>
</div>
</td>
</tr>
</table>
</ProgressTemplate>
</kw:SlickUpload>
<hr />
<asp:Button ID="UploadButton" runat="server" Text="上传" />
<asp:Button ID="CancelButton" runat="server" Text="取消" style="display:none" OnClientClick="cancelUpload();return false;" />
<br /><br />
<asp:Label ID="uploadResult" runat="server"></asp:Label>
<asp:Repeater ID="UploadFileList" runat="server" EnableViewState="false">
<HeaderTemplate><ul></HeaderTemplate>
<ItemTemplate><li><%# DataBinder.Eval(Container.DataItem, "ClientName") %></li></ItemTemplate>
<FooterTemplate></ul></FooterTemplate>
</asp:Repeater>
</div>
</form>
</body>
</html>
后台处理只需要出来下UploadComplete事件，代码如下：
代码
protected void SlickUpload1_UploadComplete(object sender, Krystalware.SlickUpload.Controls.UploadStatusEventArgs args)
{
uploadResult.Text = "上传结果：" + args.Status.State;
if(args.Status.State == UploadState.Terminated)
{
uploadResult.Text = ".原因：" + args.Status.Reason;
}
if(args.Status.State != UploadState.Terminated)
{
UploadFileList.DataSource = args.UploadedFiles;
UploadFileList.DataBind();
}
}
完成这一步后，基本上可以实现大文件的上传啦！其实呢？我们做的事情并不多，对SlickUpload底层也并不了解，然而却实现了一个比较难的功能。最后呈上效果图：
顺便提一下，如果上传同样的文件会提示Error。
