如何通过POST请求下载生成的Excel文件？解决文件损坏问题

问题描述 #

用以下AJAX代码POST请求下载生成的Excel文件时，下载的文件损坏无法打开，但用wget执行相同POST请求却能得到有效文件：

$.ajax({
        type: 'POST',
        url: url, 
        data: JSON.stringify(data),
        contentType: "application/json",
        success: (result) => {
            let blob = new Blob([result]);
            let link = document.createElement("a");
            link.href = window.URL.createObjectURL(blob);
            link.download = "inventory.xlsx";
            link.click();                
        }
    });

文件对比显示：左侧wget获取的是正常二进制Excel内容（开头有PK标识，是Excel的ZIP包特征），右侧JS获取的文件则是乱码内容，原始二进制结构已被破坏。

问题原因 #

jQuery的AJAX默认会将响应以UTF-8文本格式解析，而Excel是二进制文件，包含大量非UTF-8兼容的字节。当二进制数据被强制转成UTF-8字符串时，无法识别的字节会被替换成占位符（如�），再将这个被篡改的字符串转成Blob时，原始的二进制结构已经损坏，导致文件无法正常打开。

而wget是直接保存服务器返回的原始二进制响应，没有经过文本解析的过程，所以能得到完整有效的文件。

解决方法 #

方法1：给AJAX设置responseType: 'blob' #

直接告诉AJAX以Blob（二进制对象）格式接收响应，跳过文本解析步骤：

$.ajax({
    type: 'POST',
    url: url, 
    data: JSON.stringify(data),
    contentType: "application/json",
    responseType: 'blob', // 关键配置，指定响应为二进制Blob
    success: (result) => {
        let link = document.createElement("a");
        link.href = window.URL.createObjectURL(result);
        link.download = "inventory.xlsx";
        link.click();
        // 释放URL对象，避免内存泄漏
        window.URL.revokeObjectURL(link.href);
    }
});

方法2：使用原生Fetch API（推荐，更简洁） #

Fetch API默认支持直接获取Blob，代码更直观：

fetch(url, {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json'
    },
    body: JSON.stringify(data)
})
.then(response => response.blob())
.then(blob => {
    const link = document.createElement('a');
    link.href = URL.createObjectURL(blob);
    link.download = 'inventory.xlsx';
    link.click();
    // 清理URL对象
    URL.revokeObjectURL(link.href);
});

方法3：使用表单提交（无需AJAX） #

如果不需要异步处理，直接用表单提交POST请求，后端设置Content-Disposition: attachment; filename="inventory.xlsx"头，浏览器会自动处理文件下载：

<form method="POST" action="你的接口地址">
    <!-- 将JSON数据作为隐藏字段传递，需后端支持解析该字段 -->
    <input type="hidden" name="requestData" value='{"key": "value"}'>
    <button type="submit">下载Excel</button>
</form>

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