ajax 前端下载Excel文件,下载成功但是内容全部为乱码

ajax 前端下载Excel文件,下载成功但是内容全部为乱码,第1张

ajax 文件下载成功,但内容全部为乱码问题。尝试以下方法解决: 乱码

原生xhr请求
let uri = '/queryExport'
let xhr = new XMLHttpRequest()
xhr.onload = function(e) {
    if (this.status == 200) {
    	/* 文件下载 */
        let blob = new Blob([this.response], {
            type: "application/vnd.ms-excel;charset=UTF-8"
        })
        let downloadUrl = window.URL.createObjectURL(blob)
        let link = document.createElement('a')
        link.href = downloadUrl
        link.download = '统计.xlsx'
        document.body.appendChild(link)
        link.click()
        document.body.removeChild(link)
        window.URL.revokeObjectURL(downloadUrl)
    }
    hideLoading_dialog()
}
xhr.open("POST", uri, true)
/* 重点:后端返回的响应类型为 arraybuffer,不是常用的 blob */
xhr.responseType = "arraybuffer"
/* 此处为后端接受请求数据的 MIME 类型  */
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")
let param = new URLSearchParams()
param.append("startTime", startTime)
param.append("endTime", endTime)
xhr.send(param)
jQuery.ajax 请求jQuery>=v2.2.0
$.ajax({
  url:url,
  xhrFields: {
  	responseType: "arraybuffer"
  },
  data: {
  	startTime: startTime,
  	endTime: endTime
  },
  success:function(data){
    console.log(data); //ArrayBuffer
    console.log(new Blob([data])) // Blob
    /* 文件下载 */
    let blob = new Blob([data], {
        type: "application/vnd.ms-excel;charset=UTF-8"
    })
    let downloadUrl = window.URL.createObjectURL(blob)
    let link = document.createElement('a')
    link.href = downloadUrl
    link.download = '统计.xlsx'
    document.body.appendChild(link)
    link.click()
    document.body.removeChild(link)
    window.URL.revokeObjectURL(downloadUrl)
  }
})
jQuery 相关问题涉及版本

jQuery 中文官方文档
jQuery github
jQuery >=v1.5.1 支持 xhrFields 设置。
jQuery >=v2.2.0 支持responseType数据类型为binary时返回,不再抛出异常。(Ajax: Don’t throw exceptions on binary data response)

ArrayBuffer 和 Blob 的区别 responseType

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1324887.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-06-12
下一篇 2022-06-12

发表评论

登录后才能评论

评论列表(0条)

保存