准备文件上传的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表单上传 )

用 element-ui 的 Upload组件上传文件

http://element-cn.eleme.io/#/zh-CN/component/upload

文件下载

普通的文件下载方式是访问一个后台文件流地址，直接生成对应的文件，下载即可，地址栏中也可携带一些控制参数，但是无法通过header传递参数。

两种文件下载方式，一种是，直接返回file文件，利用浏览器的下载功能。但是这种没有发现可以在发送请求的时候携带token；另一种是利用 Axios 发送下载文件的请求，可以设置header头，可以携带token ，但是response-type是blob类型的。

第一种：

后端API:

public FileResult downloadRequest()

  {

   //var addrUrl = webRootPath + "/upload/thumb.jpg";

   var addrUrl = "D:/aaa/thumb.jpg";

 

   var stream = System.IO.File.OpenRead(addrUrl);

 

   string fileExt = Path.GetExtension("thumb.jpg");

 

   //获取文件的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";

   var addrUrl = "D:/aaa/wyy.exe";

 

   /*var stream = System.IO.File.OpenRead(addrUrl);

 

   string fileExt = Path.GetExtension("thumb.jpg");

 

   //获取文件的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 对象

   document.body.removeChild(elink);

  } else {

   // IE10+下载

   navigator.msSaveBlob(blob, fileName);

  }

  console.log(res);

  });

 }