asp.net core多文件分塊同時上傳組件使用詳解
服務器端
引用 nuget 包:JMS.FileUploader.AspNetCore
然后啟用上傳組件:
app.UseAuthorization(); app.MapControllers(); //啟用上傳組件,并限制單個文件最大100M app.UseJmsFileUploader(1024*102400); app.Run();
在 Controller 里面,寫個 Test 函數(shù),處理上傳的文件:
[ApiController] [Route("[controller]/[action]")] public class MainController : ControllerBase { [HttpPost] public string Test([FromBody] object body) { var customHeader = Request.Headers["Custom-Header"]; //臨時文件路徑 var filepaths = Request.Headers["FilePath"]; //文件名 var filenames = Request.Headers["Name"]; return filenames; } }
文件上傳完畢,保存在臨時文件中,Request.Headers["FilePath"] 可以讀取這些文件的路徑,如果確定要保留這些文件,用 File.Move 把它們移到你的目標文件夾當中;
Request.Headers["Name"] 則是讀取文件名。
前端
引入 jms-uploader 組件:
import JmsUploader from "jms-uploader"
html 元素:
<input id="file1" multiple type="file" /> <input id="file2" multiple type="file" /> <button onclick="upload()"> upload </button> <div id="info"></div>
javascript 腳本:
async function upload() { //自定義請求頭 var headers = function () { return { "Custom-Header": "test" }; }; //提交的body var dataBody = { name: "abc" }; var uploader = new JmsUploader("http://localhost:5200/main/test", [document.querySelector("#file1").files, document.querySelector("#file2").files], headers, dataBody); uploader.setPartSize(1024);//設置分塊大小,默認是102400 uploader.onUploading = function (percent, uploadedSize, totalSize) { document.querySelector("#info").innerHTML = percent + "% " + uploadedSize + "," + totalSize; }; var ret = await uploader.upload(); //上傳完畢 alert(ret); }
組件源碼地址 https://github.com/simpleway2016/JMS.FileUploader
以上就是asp.net core多文件分塊同時上傳組件使用詳解的詳細內(nèi)容,更多關(guān)于asp.net core多文件分塊上傳的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
Asp.net 頁面調(diào)用javascript變量的值
開發(fā)過程中碰到了這種情況,我想將javascript中定義的變量賦值給頁面中的TextBox控件.2009-12-12.NET使用?OpenTelemetry?Traces?追蹤應用程序的方法
OpenTelemetry Traces是OpenTelemetry提供的一種遙測數(shù)據(jù)類型,用于記錄和描述在分布式系統(tǒng)中的單個操作或工作單元的生命周期,這篇文章主要介紹了.NET中使用OpenTelemetry Traces追蹤應用程序,需要的朋友可以參考下2024-06-06Asp.net+jquery+.ashx文件實現(xiàn)分頁思路
分頁思路: .ashx程序中,編寫好取得不同頁碼的程序。在頁面布局好的前提下,留下數(shù)據(jù)區(qū)域 div。然后在頁面請求 .ashx程序生成下一頁的html代碼。覆蓋div.innerHTMl2013-03-03asp.net下GDI+的一些常用應用(水印,文字,圓角處理)技巧
asp.net下GDI+的一些常用應用(水印,文字,圓角處理)技巧...2007-03-03.NET使用原生方法實現(xiàn)文件壓縮和解壓的詳細過程
這篇文章主要介紹了.NET使用原生方法實現(xiàn)文件壓縮和解壓,本文我們主要講的是如何使用.NET原生方法System.IO.Compression命名空間中的類來對文件和文件夾進行壓縮或解壓縮(壓縮格式.zip文件格式),需要的朋友可以參考下2024-06-06asp.net下結(jié)合HttpHandler實現(xiàn)圖片防盜鏈
asp.net防圖片盜鏈HttpHandler2010-07-07ASP.NET MVC使用EPPlus,導出數(shù)據(jù)到Excel中
這篇文章介紹的是怎樣導出數(shù)據(jù)到Excel文件中,大多數(shù)的后端程序都有報表功能:把顯示在Grid中的數(shù)據(jù)導出到Excel文件中,這篇文章中使用的是EPPlus組件。需要的朋友可以參考借鑒2016-12-12