說明:使用Ajax方式上傳,文件不能過大,最好小于三四百兆,因為過多的連續Ajax請求會使后臺崩潰,獲取InputStream中數據會為空,尤其在Google瀏覽器測試過程中。
1.簡單分段讀取文件為Blob,ajax上傳到服務器
<div class="container"> <div class="panel panel-default"> <div class="panel-heading">分段讀取文件:</div> <div class="panel-body"> <input type="file" id="file" /> <blockquote style="word-break:break-all;"></blockquote> </div> </div> </div>
JS:
/* * 分段讀取文件為blob ,并使用ajax上傳到服務器 * 分段上傳exe文件會拋出異常 */ var fileBox = document.getElementById('file'); file.onchange = function () { //獲取文件對象 var file = this.files[0]; var reader = new FileReader(); var step = 1024 * 1024; var total = file.size; var cuLoaded = 0; console.info("文件大?。?quot; + file.size); var startTime = new Date(); //讀取一段成功 reader.onload = function (e) { //處理讀取的結果 var loaded = e.loaded; //將分段數據上傳到服務器 uploadFile(reader.result, cuLoaded, function () { console.info('loaded:' + cuLoaded + 'current:' + loaded); //如果沒有讀完,繼續 cuLoaded += loaded; if (cuLoaded < total) { readBlob(cuLoaded); } else { console.log('總共用時:' + (new Date().getTime() - startTime.getTime()) / 1000); cuLoaded = total; } }); } //指定開始位置,分塊讀取文件 function readBlob(start) { //指定開始位置和結束位置讀取文件 //console.info('start:' + start); var blob = file.slice(start, start + step); reader.readAsArrayBuffer(blob); } //開始讀取 readBlob(0); //關鍵代碼上傳到服務器 function uploadFile(result, startIndex, onSuccess) { var blob = new Blob([result]); //提交到服務器 var fd = new FormData(); fd.append('file', blob); fd.append('filename', file.name); fd.append('loaded', startIndex); var xhr = new XMLHttpRequest(); xhr.open('post', '../ashx/upload2.ashx', true); xhr.onreadystatechange = function () { if (xhr.readyState == 4 && xhr.status == 200) { // var data = eval('(' + xhr.responseText + ')'); console.info(xhr.responseText); if (onSuccess) onSuccess(); } } //開始發送 xhr.send(fd); } }
后臺代碼:
/// <summary> /// upload2 的摘要說明 /// </summary> public class upload2 : IHttpHandler { LogHelper.LogHelper _log = new LogHelper.LogHelper(); int totalCount = 0; public void ProcessRequest(HttpContext context) { HttpContext _Context = context; //接收文件 HttpRequest req = _Context.Request; if (req.Files.Count <= 0) { WriteStr("獲取服務器上傳文件失敗"); return; } HttpPostedFile _file = req.Files[0]; //獲取參數 // string ext = req.Form["extention"]; string filename = req.Form["filename"]; //如果是int 類型當文件大的時候會出問題 最大也就是 1.9999999990686774G int loaded = Convert.ToInt32(req.Form["loaded"]); totalCount += loaded; string newname = @"F:\JavaScript_Solution\H5Solition\H5Solition\Content\TempFile\"; newname += filename; //接收二級制數據并保存 Stream stream = _file.InputStream; if (stream.Length <= 0) throw new Exception("接收的數據不能為空"); byte[] dataOne = new byte[stream.Length]; stream.Read(dataOne, 0, dataOne.Length); FileStream fs = new FileStream(newname, FileMode.Append, FileAccess.Write, FileShare.Read, 1024); try { fs.Write(dataOne, 0, dataOne.Length); } finally { fs.Close(); stream.Close(); } _log.WriteLine((totalCount + dataOne.Length).ToString()); WriteStr("分段數據保存成功"); } private void WriteStr(string str) { HttpContext.Current.Response.Write(str); } public bool IsReusable { get { return true; } }
【網站聲明】本站除付費源碼經過測試外,其他素材未做測試,不保證完整性,網站上部分源碼僅限學習交流,請勿用于商業用途。如損害你的權益請聯系客服QQ:2655101040 給予處理,謝謝支持。