js blob导出文件 文件下载 中文乱码的问题

需求:
后端文件以二进制流的形式返回给前端, 前端需要读取流文件实现文件下载。

场景:
下载成功,文件乱码。

原因:
与后台交互时,若后台返回的是二进制流数据,前端请求时要加上{responseType:‘blob’}或者是{responseType: ‘arraybuffer’},这样数据就不是乱码了。

eg:

// 发送请求
export function reqFuc(params) {
  return request({
    url: '/xxxxx/down', // 接口
    method: 'post',  // 看后端设计的是什么类型
    responseType: 'blob', // 注意:这里必须指定返回类型,否则打不开文件
    params
  })
}
  // 数据处理
   downloadFn(params) {
      reqFuc(params)
        .then(res => {
          console.log(res)
           var content = res.data // 后端返回的流
            var data = new Blob([content], {
              type: 'application/x-download;charset=UTF-8'
            })
            var downloadUrl = window.URL.createObjectURL(data)
            var anchor = document.createElement('a')
            anchor.href = downloadUrl 
            anchor.setAttribute('download', _fileName)
            anchor.click()
        })
        .catch(err => {
          console.log(err)
        })
    

你可能感兴趣的:(js blob导出文件 文件下载 中文乱码的问题)