接上一篇，有导入也有导出的要求。需要导出excel文件。当你点击下载模板或者下载反馈结果时，axios发起一个后端接口请求，作为响应获取到返回数据时出现乱码，如图：下面总结几种处理方式。1、通过url下载，即后台提供的文件地址，直接使用浏览器通过window.location.href=文件路径下载window.location.href=`${location.origin}/operation进行下载/ruleImport/template`通过window.open(url,'_blank')window.open(`${location.origin}/operation/ruleImport/template`)这两种使用方式的区别：window.location:当前页面跳转，即重新定位当前页面；只能在该站点内打开该站点的页面。window.open:在新窗口打开一个链接；您可以在该网站上打开另一个网站地址。2.通过a标签的download属性结合blob构造函数进行下载。a标签的download属性是HTML5标准的新增内容。它的作用是触发浏览器的下载操作，而不是导航到下载的url。这个属性可以设置为在下载时使用一个新的。文件名。前端创建超链接，接收后端传来的文件流：axios.get(`/operation/ruleImport/template`,{responseType:"blob"//服务器响应的数据类型，可以是'arraybuffer','blob','document','json','text','stream',默认为'json'}).then(res=>if(!res)returnconstblob=newBlob([res.data],{type:'application/vnd.ms-excel'})//构造blob对象处理数据并设置文件类型if(window.navigator.msSaveOrOpenBlob){//兼容IE10navigator.msSaveBlob(blob,this.filename)}else{consthref=URL.createObjectURL(blob)//创建一个新的URL来表示指定的blob对象consta=document.createElement('a')//创建一个标签a.style.display='none'a.href=href//指定下载链接a.download=this.filename//指定下载文件名a.click()//触发下载URL.revokeObjectURL(a.href)//释放URL对象}//这里也可以不创建链接，直接window.open(href)也可以下载}).catch(err=>{console.log(err)})注意：请求后台接口时，在请求头中加上{responseType:'blob'}；下载配置文件名，即可直接设置扩展名。如果不是，浏览器将自动检测正确的文件扩展名并将其添加到文件中。3、通过js-file-download插件安装：npminstalljs-file-download--SUseimportfileDownloadfrom'js-file-download'axios.get(`/operation/ruleImport/template`,{responseType:'blob'//返回的数据类型}).then(res=>{fileDownload(res.data,this.fileName)})
