使用PhpSpreadsheet通过JavaScript下载Excel文件指南

概述

在web应用中，生成并下载报表或数据是常见需求。phpspreadsheet作为强大的php库，能够轻松创建excel文件。然而，当尝试通过javascript（尤其是ajax）触发下载时，开发者常会遇到文件无法下载或接收到乱码的问题。这通常是由于对http响应头和客户端下载机制的误解所致。本教程将深入探讨正确的服务器端配置和客户端javascript触发下载的方法。

服务器端配置：使用PhpSpreadsheet生成Excel文件

在服务器端（PHP），使用PhpSpreadsheet生成Excel文件并准备下载需要以下几个关键步骤：创建电子表格、填充数据、设置正确的HTTP响应头，并确保输出流的纯净性。

1. 创建和填充电子表格

首先，实例化PhpSpreadsheet对象，并向其中添加数据。

getActiveSheet();

// 设置单元格值
$activeWorksheet->setCellValue('A1', "测试单元格 A1");           
$activeWorksheet->setCellValue('B2', "测试单元格 B2");           

// ... 更多数据填充 ...

// 创建Xlsx写入器
$writer = IOFactory::createWriter($spreadsheet, 'Xlsx');

2. 设置正确的HTTP响应头

这是下载成功的关键。HTTP响应头告诉浏览器如何处理服务器返回的内容。对于Excel文件下载，需要设置Content-Type和Content-Disposition。

// 设置Content-Type头，指示浏览器响应内容是Excel文件
header('Content-Type: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');

// 设置Content-Disposition头，指示浏览器将内容作为附件下载，并指定文件名
// 注意：filename的值必须用双引号包裹，且Content-Disposition中的T和D应大写
header('Content-Disposition: attachment; filename="'.$filename.'"');

关键点解析：

立即学习“PHP免费学习笔记（深入）”；

• Content-Type: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet：这是XLSX格式文件的标准MIME类型。告知浏览器这是一个Excel文件，而非普通文本或HTML。
• Content-Disposition: attachment; filename="your_file_name.xlsx"：
  • attachment：指示浏览器将此内容作为附件下载，而不是在浏览器中直接打开。
  • filename="your_file_name.xlsx"：指定下载时默认的文件名。务必将文件名用双引号包裹，以正确处理包含空格或其他特殊字符的文件名。此外，Content-Disposition中的T和D应大写。

3. 清理输出缓冲区并输出文件

在将文件内容发送到浏览器之前，确保没有其他不相关的输出（如空白字符、错误信息等）混入文件流中。ob_end_clean()用于清除所有之前开启的输出缓冲区。exit()用于终止脚本执行，防止后续代码产生额外输出。

// 清除所有输出缓冲区，确保只有文件内容被发送
ob_end_clean();

// 将Excel文件内容直接写入PHP的输出流
$writer->save('php://output');

// 终止脚本执行
exit();

将以上PHP代码整合到一个脚本文件（例如 download_excel.php）中，当浏览器直接访问此脚本时，就会触发Excel文件的下载。

感恩节手绘南瓜主题传单设计下载

感恩节手绘南瓜主题传单设计适用于感恩节传单模板设计 本作品提供感恩节手绘南瓜主题传单设计的图片会员免费下载，格式为PSD，文件大小为14.5M； 请使用软件Photoshop进行编辑，作品中文字及图均可以通过软件修改和编辑；

下载

客户端触发：使用JavaScript下载Excel文件

当服务器端配置妥当后，客户端JavaScript不再需要通过AJAX来获取文件内容。直接使用AJAX请求下载文件通常会导致浏览器将二进制文件内容作为文本处理，从而显示乱码。正确的做法是，让浏览器直接导航到生成Excel文件的PHP脚本URL，从而触发浏览器原生的下载机制。

1. 通过window.location.href触发下载

这是最简单直接的方法，模拟用户点击链接访问下载URL：

function downloadExcel() {
    // 假设你的PHP脚本路径是 /download_excel.php
    window.location.href = '/download_excel.php'; 
}

// 示例：在一个按钮点击事件中调用
document.getElementById('downloadButton').addEventListener('click', downloadExcel);

当JavaScript执行window.location.href = '/download_excel.php'时，浏览器会向/download_excel.php发送一个GET请求。服务器响应时，根据之前设置的HTTP头，浏览器会自动开始下载文件。

2. 通过动态创建标签触发下载

这种方法在某些场景下可能更灵活，例如当你需要动态生成下载链接或在不改变当前页面URL的情况下触发下载时。

function downloadExcelProgrammatically() {
    const downloadUrl = '/download_excel.php'; // 你的PHP脚本路径

    // 创建一个临时的元素
    const link = document.createElement('a');
    link.href = downloadUrl;
    link.download = '2023 - Export Transactions.xlsx'; // 可选：指定下载的文件名，会覆盖服务器的Content-Disposition头中的文件名
    link.style.display = 'none'; // 隐藏链接

    // 将链接添加到DOM中并模拟点击
    document.body.appendChild(link);
    link.click();

    // 下载完成后移除链接
    document.body.removeChild(link);
}

// 示例：在一个按钮点击事件中调用
document.getElementById('anotherDownloadButton').addEventListener('click', downloadExcelProgrammatically);

注意事项：