js+vue 文件流下载与上传--记录

//下载文件
function downloadFile(res) {//res,返回的文件流
  let BLOB = new Blob([res.blob], {
    type: "application/vnd.ms-excel", //文件格式
  });
  console.log(BLOB);
  let fileName = res.headers["content-disposition"].split(";")[1].split("=")[1];
  fileName = getCharFromUtf8(fileName);
  console.log(fileName);

  var link = document.createElement("a");
  link.href = window.URL.createObjectURL(BLOB);
  link.download = fileName;

  const uA = window.navigator.userAgent;
  const isIE =
    /msie\s|trident\/|edge\//i.test(uA) &&
    !!(
      "uniqueID" in document ||
      "documentMode" in document ||
      "ActiveXObject" in window ||
      "MSInputMethodContext" in window
    );
  if (isIE) {
    navigator.msSaveBlob(new Blob([res.blob]), fileName);
  } else {
    link.click();
    window.URL.revokeObjectURL(link.href);
  }
}

文件上传
使用input type：file ；action：文件地址；headers：文件请求头；accept：上传文件格式（有专门的的文件上传表）
vue + antdesign 实现
事件传入值，接受的是input对象

<a-upload
          name="file"
          :action="baseUrl + '/uploadFile'"
          :headers="headers"
          :before-upload="beforeUpload"
          accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
          :fileList="fileList"
          @change="handleChange"
        >
          <a-tooltip>
            <template slot="title">上传考生变更项批量文件，xls格式</template>
            <a-button> <a-icon type="upload" />选择文件 </a-button>
          </a-tooltip>
</a-upload>

handleChange(info) {
      this.fileList = info.fileList;
      if (info.file.status !== "uploading") {
        console.log(info.file, info.fileList);
      }
      if (info.file.status === "done") {
        const res = info.file.response;
        if (res.code === "200") {
          //上传完成之后的路径
          this.fileUrl = res.data.url;
          //上传的文件的size
          // this.fileSize = info.file.size;
          this.fileName = info.file.name;
        }
        this.$message.success(`${info.file.name} 上传成功！`);
      } else if (info.file.status === "removed") {
        this.fileUrl = "";
      } else if (info.file.status === "error") {
        this.$message.error(`${info.file.name} 上传失败！`);
      }
    },