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 },