最近做项目中遇到很多问题，比如带进度条的文件上传，看了网上很多资料还没找到真正意义上的ASP.NET实现进度条上传（可能是我没找到），下面我来跟大家分享一下我实现的这个程序。
首先看下界面效果，当然你可以完全修改界面为你自己所用。
先解释一下这个程序，该程序采用了jquery框架，实现了小文件上传，不超过80Mb，可以在web.config文件中进行相应的配置，但是有个最大值，具体需要查看msdn。开发环境采用visual studio 2013 .net framework 4.5，运行的时候大家注意一下是否满足要求，好了，下面直入正题。
先来看看实现原理。基本原理：一个页面进行文件上传，另外一个页面去监听这个文件上传了多少。
这里面有两个地方需要解释一下：第一个，如何知道监听的这个文件就是上传的这个文件？实现机制很简单，就是让asp.net产生一个唯一的guid，这个id序号是唯一的，通过ajax取出来赋值给一个隐藏字段；第二个，如何获取guid标志的文件信息？通过asp.net缓存机制实现，上传的过程中，不断的将上传信息往缓存里面写，直到文件上传完成，而在另外一个通过guid获取缓存的信息，信息包括你想要的信息，比如上传了多少字节、消耗了多长时间等。好了，要点就解释到这里，有疑问的话给我留言。
下面来说说具体的实现：
文件目录结构如下：
index.htm就是文件上传页面，提交form给UploadHandler目录下的Default.aspx，以实现文件上传。
ProgressHandler目录下三个文件为Abort.ashx、GenericGuid.ashx,Handler.ashx功能分别为：根据Guid取消正在上传的文件，生成Guid，根据Guid获取上传信息。
第一步：建立index.htm页面，这个上传页面，需要注意的就是需要一个隐藏的iframe，并且名字为form提交的目标。
<!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> <title>ASP.NET Ajax文件上传进度条示例</title> <meta content="李检全" /> <link href="https://www.jb51.net/Styles/base.css" type="text/css" /> <script src="https://www.jb51.net/Scripts/jquery-1.4.2.min.js" type="text/javascript"></script> <script src="https://www.jb51.net/Scripts/jquery-ui-1.8.2.custom.min.js" type="text/javascript"></script> <script src="https://www.jb51.net/Scripts/ljq.lib.js" type="text/javascript"></script> <script src="https://www.jb51.net/Scripts/Ajax/GuidGet.js" type="text/javascript"></script> <script src="https://www.jb51.net/Scripts/Ajax/ajax-progress-upload.js" type="text/javascript"></script> </head> <body> <div> <div>ASP.NET Ajax 文件上传进度条示例</div> <form action="UploadHandler/Default.aspx" enctype="multipart/form-data" method="post" target="upload_hidden_iframe"> <input value="" type="hidden" /> <p>*本程序适合小文件上传，不超过80Mb</p> <p>文件地址</p> <input type="file" /> <br /> <p>文件描述</p> <textarea></textarea> <br /> <br /> <input type="submit" value="上传文件" /> </form> </div> <div></div> <div> <div>文件上传</div> <div> <ul> <li>正在准备上传...</li> <li><div><div></div></div></li> <li></li> <li></li> <li></li> <li></li> </ul> <div></div> <div> <span>取消</span><span>确定</span> </div> </div> </div> <iframe></iframe> </body> </html>
第二步，创建GenerateGuid.ashx文件，作用就是生成唯一的Guid。
<%@ WebHandler Language="C#" %> using System; using System.Web; using System.Xml.Linq; namespace ProgressHandler { public class Handler : IHttpHandler { /// <summary> /// 获得上传文件的GUID /// </summary> /// <param>当前请求实体</param> /// <creattime>2015-06-28</creattime> /// <author>FreshMan</author> public void ProcessRequest(HttpContext context) { context.Response.Charset = "utf-8"; context.Response.ContentType = "application/xml"; var guid = Guid.NewGuid().ToString(); var doc = new XDocument(); var root = new XElement("root"); var xGuid = new XElement("guid", guid); root.Add(xGuid); doc.Add(root); context.Response.Write(doc.ToString()); context.Response.End(); } public bool IsReusable { get { return false; } } } }
第三步，创建Default.aspx文件，用于提交表单时上传文件。