开发中遇到一个下载ZIP压缩包文件的需求,记录在这里。这里我有一个从后端返回ZIP的流文件。下面的方法被用来处理它。this.$api.gameApi.dow??nloadZIP(this.gameInformation.id,row.id).then(res=>{constblob=newBlob([res.data],{type:'application/zip'})consturl=window.URL.createObjectURL(blob)constlink=document.createElement('a')//创建标签link.href=urllink.download=row.name//重命名文件link.click()URL.revokeObjectURL(url)//释放内存})简单的使用这种方式,下载的压缩包打不开,需要配置axios如下downloadZIP(id,bundlesId){return$axios({methods:"get",url:`/v1/${id}/material/bundle/${bundlesId}`,responseType:'blob'})},只需添加:responseType:'blob'。后续补充:当后台提供下载地址后,前台可以直接下载。方法如下:这里使用的是el-upload组件提供的:on-preview方法。handlePreview(文件){consta=document.createElement('a');if(typeofa.download!=='undefined'){a.href=file.urla.download=file.namedocument.body.appendChild(a);a.点击();a.删除();}else{window.location=file.url//window.open(file.url)}},这个是使用a标签download函数提供的download方法实现的。当判断浏览器不支持下载方法时,可以调用window.location和window.open方法下载文件。window.location可以在当前页面下载。window.open将打开一个新窗口供下载。
