BootStrap Progressbar 实现大文件上传的进度条

1.首先实现大文件上传，如果是几兆或者几十兆的文件就用基本的上传方式就可以了，但是如果是大文件上传的话最好是用分片上传的方式。我这里主要是使用在客户端进行分片读取到服务器段，然后保存，到了服务器段读取完了之后将分片数据进行组合。

2.前端代码如下：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UploadTest2.aspx.cs" Inherits="Html5UploadTest.UploadTest2" %>

"zh-CN">


    "utf-8">
    
    
    "bootstrap-progressbar/bootstrap-progressbar-3.3.4.css" rel="stylesheet" />
    

    <%--"JqueryUI/jquery-ui.css" rel="stylesheet" />
    --%>
    



    "file" id="file" />

    "upload" οnclick="uploadFile();">上传

    "output" style="font-size: 12px">等待
    
class="progress">
        
"progressBar" class="progress-bar" role="progressbar" data-transitiongoal="">
    

View Code

3. 后台一般处理程序如下：

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Web;

namespace Html5UploadTest
{
    /// 

    /// Summary description for Upload
    /// 
    public class Upload : IHttpHandler
    {
        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            try
            {
                //从Request中取参数，注意上传的文件在Requst.Files中
                string name = context.Request["name"];
                int total = Convert.ToInt32(context.Request["total"]);
                int index = Convert.ToInt32(context.Request["index"]);
                var data = context.Request.Files["data"];
                //保存一个分片到磁盘上
                string dir = context.Request.MapPath("~/temp");
                string file = Path.Combine(dir, name + "_" + index);
                data.SaveAs(file);
                //如果已经是最后一个分片，组合
                //当然你也可以用其它方法比如接收每个分片时直接写到最终文件的相应位置上，但要控制好并发防止文件锁冲突
                if (index == total)
                {
                    file = Path.Combine(dir, name);
                    //byte[] bytes = null;
                    using (FileStream fs = new FileStream(file, FileMode.OpenOrCreate))
                    {
                        for (int i = 1; i <= total; ++i)
                        {
                            string part = Path.Combine(dir, name + "_" + i);
                            //bytes = System.IO.File.ReadAllBytes(part);
                            //fs.Write(bytes, 0, bytes.Length);
                            //bytes = null;
                            System.IO.File.Delete(part);
                            fs.Close();
                        }
                    }
                }
            }
            catch (Exception)
            {
                throw;
            }
            //返回是否成功，此处做了简化处理
            //return Json(new { Error = 0 });
        }
        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

View Code

4.当然了后台还需要一些异常处理或者断电续传的工作要做，待续。。。

转载于:https://www.cnblogs.com/caishuhua226/p/4705243.html