vue附件下载无法打开的问题及解决
更新时间：2024年07月27日 10:30:21 作者：王红珠
这篇文章主要介绍了vue附件下载无法打开的问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
vue附件下载无法打开
描述
最近做了一个excel导出功能，在浏览器地址栏直接请求接口可以正常下载，但在vue项目里请求接口返回值为一堆乱码
如下图：
代码如下：
查阅资料后
知道需要将后端java返回的文件流处理为blob，并下载
代码如下：
现在文件可以导出了，但是导出的文件无法查看
如下图：
最终解决方案为在请求中添加 responseType: 'blob'
代码如下：
const params = {
siteId: this.siteId,
beginDate: this.dateValue[0],
endDate: this.dateValue[1]
}
axios.get('/ui/sacstatistics/getStatisticsExcel', { params, responseType: 'blob' }).then((res) => {
const data = res.data
let blob = new Blob([data], {
type: 'application/vnd.ms-excel'
})
let url = window.URL.createObjectURL(blob)
let a = document.createElement('a')
a.href = url
a.download = '网站内容更新统计.xlsx' // 自定义文件名称
a.click()
})
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
许多朋友想要材料上传之后点击预览实现在浏览器上预览的效果,所以本文将给大家介绍如何使用vue实现pdf预览功能,文中有实现代码,有需要的朋友可以参考阅读下2023-08-08
今天小编就为大家分享一篇vue 实现路由跳转时更改页面title，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
这篇文章主要介绍了vue-cli axios请求方式及跨域处理问题,文中还给大家提到了vue中axios解决跨域问题和拦截器使用，非常不错，具有参考借鉴价值，需要的朋友参考下吧2018-03-03
这篇文章主要给大家介绍了关于vue解决跨域问题的几种方式,跨域跨域报错是前端开发中非常经典的一个错误,文中通过代码示例介绍的非常详细,需要的朋友可以参考下2023-07-07
这篇文章主要介绍了vue获取参数的几种方式总结，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-08-08
这篇文章主要介绍了vue 组件开发原理与实现方法,结合实例形式详细分析了vue.js组件开发的原理与实现方法,需要的朋友可以参考下2019-11-11
在Vue中使用过滤器（Filters）来渲染数据是一种很有趣的方式,下面这篇文章主要给大家介绍了关于Vue过滤器（filter）实现及应用场景的相关资料,需要的朋友可以参考下2021-06-06
今天小编就为大家分享一篇vue 实现特定条件下绑定事件，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
解决vue项目,npm run build后,报路径错的问题
这篇文章主要介绍了解决vue项目,npm run build后,报路径错的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-08-08
这篇文章主要介绍了vue动态子组件的两种实现方式,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下2019-09-09
最新评论