分享一个可多个文件同时上传、断点续传，并实时反馈上传进度的 Asp.Net core 组件。
服务器端
引用 nuget 包：JMS.FileUploader.AspNetCore
然后启用上传组件：
app.UseAuthorization();
app.MapControllers();
//启用上传组件，并限制单个文件最大100M
app.UseJmsFileUploader(1024*102400);
app.Run();
在 Controller 里面，写个 Test 函数，处理上传的文件：
[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.git
到此这篇关于asp.net core 多文件分块同时上传的组件的文章就介绍到这了,更多相关asp.net core 多文件上传内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
您可能感兴趣的文章:
- ASP.NET Core实现多文件上传
- asp.net core webapi文件上传功能的实现
- ASP.NET Core单文件和多文件上传并保存到服务端的方法
- ASP.NET Core文件上传与下载实例(多种上传方式)
- asp.net core分块上传文件示例
- asp.net core mvc实现文件上传实例
- 解决ASP.NET Core Mvc文件上传限制问题实例
本文由 华域联盟 原创撰写：华域联盟 » asp.net core 多文件分块同时上传的组件
转载请保留出处和原文链接：https://www.cnhackhy.com/160027.htm
