React中使用FileSaver.js无法在客户端下载xlsx文件

我之前也碰到过一模一样的问题！折腾了好久才搞定，给你梳理下关键问题点和解决步骤：

1. 先修正Axios请求的参数结构（你这里大概率写错了） #

看你贴的代码片段，axios.post的参数格式不对！axios.post的第三个参数是单个配置对象，不能拆成两个对象分开传。把params和responseType都放到同一个config里，而且responseType用blob会更直接：

axios.post(
  '/api/report/generateReport',
  {}, // 你的接口不需要请求体的话留空没问题
  {
    params: { 
      reportId: this.state.reportId, 
      lob: this.state.lob 
    },
    responseType: 'blob' // 必须放在这个config对象里，不能单独传
  }
)
.then(response => {
  // 下面写下载逻辑
})
.catch(err => {
  console.error('下载出错:', err);
});

2. 正确处理Blob并触发下载 #

拿到响应后，要确保Blob的类型正确，然后通过创建临时链接触发下载：

.then(response => {
  // 强制指定正确的XLSX MIME类型，避免后端返回的类型不对
  const contentType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
  // 把返回的二进制数据转成Blob
  const blob = new Blob([response.data], { type: contentType });
  
  // 创建下载链接
  const url = window.URL.createObjectURL(blob);
  const link = document.createElement('a');
  link.href = url;
  
  // 提取文件名（如果后端返回了content-disposition头的话），没有就自定义
  const fileName = response.headers['content-disposition'] 
    ? response.headers['content-disposition'].split('filename=')[1].replace(/"/g, '')
    : `report_${Date.now()}.xlsx`;
  link.setAttribute('download', fileName);
  
  // 触发下载
  document.body.appendChild(link);
  link.click();
  
  // 清理临时资源，避免内存泄漏
  document.body.removeChild(link);
  window.URL.revokeObjectURL(url);
})

3. 排查后端可能的坑 #

如果前端改完还是打不开文件，大概率是后端的问题：

• 确认后端有没有设置正确的Content-Type头：application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
• 检查后端输出的文件流有没有被污染（比如额外输出了日志、错误信息、空格之类的），这些都会导致XLSX文件损坏
• 确认后端返回的byte[]是完整的XLSX文件内容，没有编码错误

额外情况：如果后端返回的是base64格式的byte[] #

如果后端返回的不是纯二进制，而是base64编码的字符串，那需要先转成Uint8Array再创建Blob：

const byteCharacters = atob(response.data);
const byteNumbers = new Array(byteCharacters.length);
for (let i = 0; i < byteCharacters.length; i++) {
  byteNumbers[i] = byteCharacters.charCodeAt(i);
}
const byteArray = new Uint8Array(byteNumbers);
const blob = new Blob([byteArray], { type: contentType });

内容的提问来源于stack exchange，提问作者user9566399