vue中下载Excel,返回类型为 application/octer-stream、

发布于 2022-09-12 23:46:38 字数 1208 浏览 48 评论 0

返回的在浏览器preview看到是一堆乱码,
headers内:
image.png
后端返回的是一个Excel文件,前端该如何处理并让界面这边下载下来

downloadFile(query).then(res => {
 
          console.log(res.headers["content-disposition"])
          const blob = new Blob([res], { type: 'application/octer-stream,charset=utf-8' });
          const fileName = this.fileName
          if ('download' in document.createElement('a')) { // 非IE下载
            const elink = document.createElement('a')
            elink.download = fileName
            elink.style.display = 'none'
            elink.href = URL.createObjectURL(blob)
            document.body.appendChild(elink)
            elink.click()
            URL.revokeObjectURL(elink.href) // 释放URL 对象
            document.body.removeChild(elink)
          } else { // IE10+下载
            navigator.msSaveBlob(blob, fileName)
          }
        })

======================
问题已经解决

设置返回值类型为blob
image.png
然后打印返回值,看到blob对象里,res.data才应该是需要处理的文件,所以这里改成

const blob = new Blob([res.data], {type: 'application/vnd.ms-excel;charset=utf-8'});

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

凑诗 2022-09-19 23:46:38

responseType: blob 之后就是 blob 了,就不需要再次 new Blob

你只需要吧download改成对的文件名,然后打开的时候就会用excel去解析的

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文