本地下載文件的方法(兼容下載圖片和視頻)

function downloadFile(url, filename) {
      /**
       * 原因是由於圖片類文件無法直接下載
    * 下載文件
    * 原理：通過獲取文件內容轉譯爲二進制，傳給創建a標籤下載
    * @param url  文件地址url
    * @param filename 下載保存的名字
    */
      var downloadFileBya = function (fileName, content) {
        var aLink = document.createElement('a');
        var blob = new Blob([content]);
        var evt = document.createEvent("MouseEvents");
        evt.initEvent("click", true, true);
        if (fileName) {
          aLink.download = fileName;
        }
        aLink.target = "_blank";
        aLink.href = URL.createObjectURL(blob);
        // 自定義觸發事件
        aLink.dispatchEvent(evt);
      }
      // 拿文件的名字
      var fileNameFromHeader = function (disposition) {
        if (disposition) {
          // 正則取值'/'前面的數值
          // 這裏應該根據具體得的場景來取值
          let index = disposition.lastIndexOf("\/");
          return decodeURIComponent(disposition.substring(index + 1, disposition.length));
        }
        return "undefine_file";
      }

      var xhr = new XMLHttpRequest();
      xhr.withCredentials = false;
      xhr.responseType = "blob";
      xhr.open('GET', url, true);
      xhr.onload = function () {
        if (this.status == 200) {
          // var blob = this.response;
          var donwloadName = filename != undefined ? filename : fileNameFromHeader(xhr.responseURL);
          downloadFileBya(donwloadName, xhr.response);
        } else {
          console.error("請求下載文件錯誤，請求錯誤碼：" + this.status);
          return false;
        }
      }
      xhr.send();
    }

如果是普通的文件本地需要下載直接調用window.open()這個方法

如果是文件上傳(並且對參數有一定的要求要formData形式的，如下類似的操作即可)

 1      // 導入Excel
 2     onchangeSuccess(event) {
 3       const file = event.target.files[0];
 4       console.log(file)
 5       const formData = new FormData();
 6       formData.append("file", file);
 7       const option = formData;
 8       headPlayGetUpload(option, this.fileId).then( res =>{
 9         console.log(res, '導入Excel')
10         if (res.code == 200) {
11            this.$message({
12           type:'success',
13           message:'導入成功'
14         })
15         this.fileId = res.result.fileId;
16         }
17       })   
18     },