如何实现HTML按钮触发Excel导出时，支持浏览器选择保存路径或默认下载？

你的当前后端代码有个核心问题：你把Excel文件写到了服务器自己的本地磁盘路径（C:\\Users\\user\\Desktop\\revenue.xls），这对于前端用户来说完全不可访问，用户根本拿不到这个文件。要实现让浏览器触发下载（要么用默认下载文件夹，要么让用户选择保存路径），我们需要把文件流直接输出到HttpServletResponse中，让浏览器处理下载逻辑。

修改后的后端代码 #

@GetMapping(value = "/coaExport", params = "action=excel")
public void exportCOAExcel(HttpServletRequest request, HttpServletResponse response) throws IOException {
    XSSFWorkbook workbook = new XSSFWorkbook();
    // 保留你填充Excel数据的业务逻辑
    // ...

    // 设置响应头，告知浏览器这是一个下载文件
    response.setContentType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet");
    String fileName = "revenue.xlsx"; // 注意XSSFWorkbook对应xlsx格式，不要用xls后缀
    // 处理中文文件名编码，避免浏览器显示乱码
    String encodedFileName = URLEncoder.encode(fileName, "UTF-8");
    response.setHeader("Content-Disposition", "attachment; filename=\"" + encodedFileName + "\"");

    // 将workbook写入响应输出流，而非本地文件
    try (ServletOutputStream outputStream = response.getOutputStream()) {
        workbook.write(outputStream);
        outputStream.flush();
    } finally {
        workbook.close(); // 关闭workbook资源，避免内存泄漏
    }
}

代码关键说明 #

• 响应头配置：Content-Type指定文件为xlsx格式（匹配XSSFWorkbook生成的Office Open XML文件）；Content-Disposition的attachment指令告诉浏览器触发下载行为，而非直接打开文件。
• 文件名编码：用URLEncoder.encode处理文件名，解决不同浏览器下中文文件名乱码的问题。
• 流资源管理：使用try-with-resources语法自动关闭ServletOutputStream，同时手动关闭XSSFWorkbook，确保资源被正确释放。
• 格式修正：XSSFWorkbook生成的是xlsx文件，修改文件名后缀避免浏览器识别格式错误。

前端配合（简单示例） #

前端按钮触发接口时，可直接用跳转或创建下载链接的方式：

<!-- 直接用a标签跳转 -->
<a href="/coaExport?action=excel" target="_blank">导出Excel</a>

<!-- 按钮点击事件方案 -->
<button onclick="exportExcel()">导出Excel</button>
<script>
function exportExcel() {
    // 简单跳转方式
    window.location.href = "/coaExport?action=excel";
    
    // 若需要携带请求头（如token），可使用fetch处理blob
    // fetch('/coaExport?action=excel', { headers: { 'Authorization': 'Bearer ' + token } })
    //   .then(res => res.blob())
    //   .then(blob => {
    //     const url = URL.createObjectURL(blob);
    //     const a = document.createElement('a');
    //     a.href = url;
    //     a.download = 'revenue.xlsx';
    //     a.click();
    //     URL.revokeObjectURL(url);
    //   });
}
</script>

修改完成后，用户点击按钮时，浏览器会根据自身设置，要么直接将文件保存到默认下载文件夹，要么弹出窗口让用户选择保存路径，完全符合你的需求。

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