① js 大文件分片上傳處理如何實現
推薦採用webuploader控制項來解決。
關於WebUploader的功能說明:
大文件上傳續傳
支持超大文件上傳(100G+)和續傳,可以關閉瀏覽器,重啟系統後仍然繼續上傳。
開源
提供ASP.NET,JSP,PHP示例和源代碼,其中JSP提供MySQL,Oracle,SQL Server資料庫的配置和示例代碼。
分片、並發
分片與並發結合,將一個大文件分割成多塊,並發上傳,極大地提高大文件的上傳速度。
當網路問題導致傳輸錯誤時,只需要重傳出錯分片,而不是整個文件。另外分片傳輸能夠更加實時的跟蹤上傳進度。
預覽、壓縮
支持常用圖片格式jpg,jpeg,gif,bmp,png預覽與壓縮,節省網路數據傳輸。
解析jpeg中的meta信息,對於各種orientation做了正確的處理,同時壓縮後上傳保留圖片的所有原始meta數據。
多途徑添加文件
支持文件多選,類型過濾,拖拽(文件&文件夾),圖片粘貼功能。上傳本地指定路徑的文件,不需要通過點擊按鈕選擇文件。
粘貼功能主要體現在當有圖片數據在剪切板中時(截屏工具如QQ(Ctrl + ALT + A), 網頁中右擊圖片點擊復制),Ctrl + V便可添加此圖片文件。
HTML5 & FLASH
兼容主流瀏覽器和低版本瀏覽器,介面一致,實現了兩套運行時支持,用戶無需關心內部用了什麼內核。而且支持IE6,IE8瀏覽器。
同時Flash部分沒有做任何UI相關的工作,方便不關心flash的用戶擴展和自定義業務需求。
基於內存映射模式進行IO操作,充分發揮操作系統性能。
MD5秒傳
當文件體積大、量比較多時,支持上傳前做文件md5值驗證,一致則可直接跳過。
如果服務端與前端統一修改演算法,取段md5,可大大提升驗證性能,耗時在20ms左右。
易擴展、可拆分
採用可拆分機制, 將各個功能獨立成了小組件,可自由搭配。
採用AMD規范組織代碼,清晰明了,方便高級玩家擴展。
② Android上大文件分片上傳 具體怎麼弄
正常情況下,一般都是在長傳完成後,在伺服器直接保存。
?
1
2
3
4
5
6
7
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
//保存文件
context.Request.Files[0].SaveAs(context.Server.MapPath("~/1/" + context.Request.Files[0].FileName));
context.Response.Write("Hello World");
}
最近項目中用網路開源的上傳組件webuploader,官方介紹webuploader支持分片上傳。具體webuploader的使用方法見官網http://fex..com/webuploader/。
?
1
2
3
4
5
6
7
8
9
10
11
12
var uploader = WebUploader.create({
auto: true,
swf:'/webuploader/Uploader.swf',
// 文件接收服務端。
server: '/Uploader.ashx',
// 內部根據當前運行是創建,可能是input元素,也可能是flash.
pick: '#filePicker',
chunked: true,//開啟分片上傳
threads: 1,//上傳並發數
//由於Http的無狀態特徵,在往伺服器發送數據過程傳遞一個進入當前頁面是生成的GUID作為標示
formData: {guid:"<%=Guid.NewGuid().ToString()%>"}
});
webuploader的分片上傳是把文件分成若干份,然後向你定義的文件接收端post數據,如果上傳的文件大於分片的尺寸,就會進行分片,然後會在post的數據中添加兩個form元素chunk和chunks,前者標示當前分片在上傳分片中的順序(從0開始),後者代表總分片數。
③ PHP實現瀏覽器端大文件分片上傳如何實現
分片上傳的原理就是通過切割上傳文件,然後在瀏覽器的頭部通過etag來進行劃分文件傳輸,伺服器端接收到文件片段和分割起始符之後,進行拼接文件,最後合成一個大文件。
你可以自己通過php來獲取瀏覽器頭部傳輸標志來進行文件的拼接組裝,也可以通過現有的大文件傳輸類來上傳文件。
關鍵點
記住分割文件點,也就是分割文件的順序,拼接文件需要通過etag按照順序拼接,分片可以並發傳輸,這其實也是並發下載的原理。
④ 區域網 大文件分片上傳處理如何實現
如果向公網上面傳,則沒啥好辦法,因為公網的路由器太多了,默認基本都是1500位元組。如果是私網自己能控制,也可以把路由器切片調大一些,但自己一定要明白自己的大文件不分片是多少(一般情況下加上雙層標簽就算多的了),要注意分片的合理性,適合就好。
⑤ JavaScript 大文件分片上傳處理如何實現
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>upload</title> <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> </head> <body> <input type="file" name="file" id="file"> <button id="upload" onClick="upload()">upload</button> <script type="text/javascript"> var bytesPerPiece = 1024 * 1024; // 每個文件切片大小定為1MB . var totalPieces; //發送請求 function upload() { var blob = document.getElementById("file").files[0]; var start = 0; var end; var index = 0; var filesize = blob.size; var filename = blob.name; //計算文件切片總數 totalPieces = Math.ceil(filesize / bytesPerPiece); while(start < filesize) { end = start + bytesPerPiece; if(end > filesize) { end = filesize; } var chunk = blob.slice(start,end);//切割文件 var sliceIndex= blob.name + index; var formData = new FormData(); formData.append("file", chunk, filename); $.ajax({ url: 'http://localhost:9999/test.php', type: 'POST', cache: false, data: formData, processData: false, contentType: false, }).done(function(res){ }).fail(function(res) { }); start = end; index++; } } </script> </body> </html>
⑥ netty4怎麼實現分片上傳,斷點續傳
netty4怎麼實現分片上傳,斷點續傳
JAVA WEB文件上傳步驟如下:
實現 Web 開發中的文件上傳功能,兩個操作:在 Web 頁面添加上傳輸入項,在 Servlet 中讀取上傳文件的數據並保存在本地硬碟中。
1、Web 端上傳文件。在 Web 頁面中添加上傳輸入項:<input type="file"> 設置文件上傳輸入項時應注意:(1) 必須設置 input 輸入項的 name 屬性,否則瀏覽器將不會發送上傳文件的數據。(2) 必須把 form 的 enctype 屬性設為 multipart/form-data,設置該值後,瀏覽器在上傳文件時,將把文件數據附帶在 http 請求消息體中,並使用 MIME 協議對上傳文件進行描述,以方便接收方對上傳數據進行解析和處理。(3) 表單提交的方式要是 post
2、伺服器端獲取文件。如果提交表單的類型為 multipart/form-data 時,就不能採用傳統方式獲取數據。因為當表單類型為 multipart/form-data 時,瀏覽器會將數據以 MIME 協議的形式進行描述。如果想在伺服器端獲取數據,那麼我們必須採用獲取請求消息輸入流的方式來獲取數據。
3、Apache-Commons-fileupload。為了方便用戶處理上傳數據,Apache 提供了一個用來處理表單文件上傳的開源組建。使用 Commons-fileupload 需要 Commons-io 包的支持。
4、fileuplpad 組建工作流程
(1)客戶端將數據封裝在 request 對象中。
(2)伺服器端獲取到 request 對象。
(3)創建解析器工廠 DiskFileItemFactory 。
(4)創建解析器,將解析器工廠放入解析器構造函數中。之後解析器會對 request 進行解析。
(5)解析器會將每個表單項封裝為各自對應的 FileItem。
(6)判斷代表每個表單項的 FileItem 是否為普通表單項 isFormField,返回 true 為普通表單項。
(7)如果是普通表單項,通過 getFieldName 獲取表單項名,getString 獲得表單項值。
(8)如果 isFormField 返回 false 那麼是用戶要上傳的數據,可以通過 getInputStream 獲取上傳文件的數據。通過getName 可以獲取上傳的文件名
⑦ java webuploader 分片上傳怎麼確定是同一個文件
關於插件的使用可以參考快速使用文檔。在Github上下載了最新的壓縮包後,基於其中的一個例子(image-upload)做了修改,主要是補充了.net後台分片接收文件的實現。
⑧ jquery.uploadify 能否實現分片上傳
簡單實現限制uploadify上傳個數
?
123456789101112131415161718
function deleteUrl(){ $("body").on("click",".img-wrap .mask span",function(event){ event.stopPropagation(); var qs=$('#file_upload-queue>div');//所有的隊列 var id=qs.eq(2).attr('id');//得到第三個隊列的id $('#uploadTowedAccredit').uploadify('cancel',id);//這樣就行了,會自動重置隊列數量和刪除dom對象,不能直接qs.eq(2).remove(),無效 /* if(!window.confirm("您確定刪除附件?")){ return; } var imgUrl=$(this).parents(".img-wrap").find("img").attr("src"); deleteImage(imgUrl); $(this).parents(".img-wrap").remove(); */ });};
?
12345678
<li class="blockli clearfix" style="padding-bottom: 5px;"> <span class="left-name"><em class="red-star">*</em>拖機授權委託書:</span> <div class="upload-wrap" style="width:100px;"> <input type="file" name="uploadTowedAccredit" id="uploadTowedAccredit" class="filetext"/> </div> <span id="uploadTowedAccreditLinkTip" class="warn-tips"><em></em>請上傳附件,最多上傳${towedAccreditPicMax} 張</span> <div id="towedAccreditDiv" class="up-img-list clearfix"></div></li>
?
// 上傳拖機授權委託書function uploadTowedAccreditInit(){ $("#uploadTowedAccredit").uploadify({ 'hideButton':'true', 'preventCaching' : 'true', 'checkExisting':'true', 'swf': SWF, 'uploader':uploadImg, 'debug':false, 'multi': true, 'method': 'post', 'preventCaching' : true, 'removeCompleted' : true, 'removeTimeout' : 10, 'requeueErrors' : true, 'successTimeout' : 30, 'uploadLimit' : ${towedAccreditPicMax}, 'fileObjName' : 'Filedata', //單張圖片最大限制 'fileSizeLimit' : '1024KB', 'fileTypeDesc' : 'Image Files', //僅限上傳jpg格式圖片 'fileTypeExts' : '*.jpg;*.png', 'height': 24, 'width':73, 'buttonText' : '上傳附件', 'auto': true, 'buttonClass':'uploada btn-fff-24', 'onSWFReady' : function() { },
⑨ asp.net 大文件分片上傳處理如何實現
用FormData對象可以實現,參考網頁鏈接