在本篇文章里小编给大家整理的是关于asp.net大文件上传解决方案以及相关实例代码,有需要的朋友们学习下。
以ASP.NET Core WebAPI 作后端 API ,用 Vue 构建前端页面,用 Axios 从前端访问后端 API ,包括文件的上传和下载。
准备文件上传的API
#region 文件上传 可以带参数 [HttpPost("upload")] public JsonResult uploadProject(IFormFile file, string userId) { if (file != null) { var fileDir = "D:\\aaa"; if (!Directory.Exists(fileDir)) { Directory.CreateDirectory(fileDir); } //文件名称 string projectFileName = file.FileName; //上传的文件的路径 string filePath = fileDir + $@"\{projectFileName}"; using (FileStream fs = System.IO.File.Create(filePath)) { file.CopyTo(fs); fs.Flush(); } return Json("ok"); }else{ return Json("no"); } } #endregion
前端vue上传组件 ( 利用Form表单上传 )
<div> <button>上传</button></div>
用 element-ui 的 Upload组件上传文件
http://element-cn.eleme.io/#/zh-CN/component/upload
<div> 选取文件上传到服务器</div>
文件下载
普通的文件下载方式是访问一个后台文件流地址,直接生成对应的文件,下载即可,地址栏中也可携带一些控制参数,但是无法通过header传递参数。
两种文件下载方式,一种是,直接返回file文件,利用浏览器的下载功能。但是这种没有发现可以在发送请求的时候携带token;另一种是利用 Axios 发送下载文件的请求,可以设置header头,可以携带token ,但是response-type是blob类型的。
第一种:
后端API:
public FileResult downloadRequest() { //var addrUrl = webRootPath + "/upload/thumb.jpg-600"; var addrUrl = "D:/aaa/thumb.jpg-600"; var stream = System.IO.File.OpenRead(addrUrl); string fileExt = Path.GetExtension("thumb.jpg-600"); //获取文件的ContentType var provider = new FileExtensionContentTypeProvider(); var memi = provider.Mappings[fileExt]; return File(stream, memi, Path.GetFileName(addrUrl)); }
前端利用浏览器的功能url直接返回文件
下载文件…
downloadRequest() { let url = "Home/downloadRequest"; //可以在路径中传递参数 window.location.href = url; }, 第二种 后端api ,两个api的返回类型不同,asp.net core 文件下载常用的有FileResult 、FileContentResult 、 FileStreamResult。 public FileContentResult downloadRequest1() { //string webRootPath = _hostingEnvironment.WebRootPath; //var addrUrl = webRootPath + "/upload/thumb.jpg-600"; var addrUrl = "D:/aaa/wyy.exe"; /*var stream = System.IO.File.OpenRead(addrUrl); string fileExt = Path.GetExtension("thumb.jpg-600"); //获取文件的ContentType var provider = new FileExtensionContentTypeProvider(); var memi = provider.Mappings[fileExt]; return File(stream, memi, Path.GetFileName(addrUrl));*/ //return stream; byte[] fileBytes = System.IO.File.ReadAllBytes(addrUrl); string fileName = "wyy.exe"; return File(fileBytes, System.Net.Mime.MediaTypeNames.Application.Octet, fileName); //关键语句 }
前端页面
blob(用来存储二进制大文件)
下载文件11 ... ... ... downloadRequest1() { axios({ // 用axios发送post请求 method: "post", url: "Home/downloadRequest1", // 请求地址 ,也可以传递参数 headers: { //可以自定义header gggg: "gggggggggggggggggggggggggggggggggggggggggggggggggggg" //可以携带token }, responseType: "blob" // 表明返回服务器返回的数据类型 }).then(res => { // 处理返回的文件流 //主要是将返回的data数据通过blob保存成文件 var content = res.data; var blob = new Blob([content]); var fileName = "wyy.exe"; //要保存的文件名称 if ("download" in document.createElement("a")) { // 非IE下载 var elink = document.createElement("a"); elink.download = fileName; elink.style.display = "none"; elink.href = URL.createObjectURL(blob); document.body.appendChild(elink); elink.click(); URL.revokeObjectURL(elink.href); // 释放URL 对象 do<a style="color:transparent">来源gao($daima.com搞@代@#码网</a>cument.body.removeChild(elink); } else { // IE10+下载 navigator.msSaveBlob(blob, fileName); } console.log(res); }); }
以上就是asp.net大文件上传解决方案实例代码的详细内容,更多请关注gaodaima搞代码网其它相关文章!