导出时前端响应是一堆乱码,但浏览器上并没有文件下载记录的文件,如图
前端vue解决方法一
关键在加blob这一步
// 下载未导入成功的数据
// api方法
downExceptionUser(data){
return service.request({
url: "questionnaire/questionnaire/downExceptionUser",
method: "post",
responseType: 'blob',
data
});
}
js文件绑定事件按钮调用的方法
// 绑定导出事件方法
function downErrorUser(){
// 调用后台api方法
api.downExceptionUser(data)
.then(res => {
download(res); // 调用解析乱码方法
})
.catch(err => {
console.log(err)
})
}
// 将后台返回的乱码解析成文件下载
function download (data) {
if (!data) {
return
}
let url = window.URL.createObjectURL(new Blob([data]))
let link = document.createElement('a')
link.style.display = 'none'
link.href = url
link.setAttribute('download', 'excel.xlsx')
document.body.appendChild(link)
link.click()
}
方法二
这种方式比较简单但是效果确实相同的
window.location.href = process.env.VUE_APP_SERVICE_URL + "url"
最终效果