vue--前端接收后台传过来的excel文件数据,并在前端做下载
一.思路:1.利用Bold接收数据2.利用a标签做文件下载二.相关代码axios.post(url, queryParams, { responseType: 'arraybuffer' }).then((_res) => {const blob = new Blob([_res.data], { type: 'application/vnd.ms-ex...
·
一.思路:
1.利用Bold接收数据
2.利用a标签做文件下载
二.相关代码
axios.post(url, queryParams, { responseType: 'arraybuffer' }).then((_res) => {
const blob = new Blob([_res.data], { type: 'application/vnd.ms-excel;' })
const a = document.createElement('a')
// 生成文件路径
let href = window.URL.createObjectURL(blob)
a.href = href
let _fileName = _res.headers['content-disposition'].split(';')[1].split('=')[1].split('.')[0]
// 文件名中有中文 则对文件名进行转码
a.download = decodeURIComponent(_fileName)
// 利用a标签做下载
document.body.appendChild(a)
a.click()
document.body.removeChild(a)
window.URL.revokeObjectURL(href)
})
三 .代码要点:
1.设置responseType: 'arraybuffer': 解决下载下来的文件乱码问题
2.设置type: 'application/vnd.ms-excel;:设置excel文件的格式.(该格式需要与后台确认)
office中后缀对应的content-type在office 所有后缀对应的 content-type中可以查看
3.若后台传过来的文件名中有中文,则需要对该文件名进行转码
更多推荐
已为社区贡献3条内容
所有评论(0)