高效前端解决方案：使用 JS 批量导出 Excel 为 ZIP 压缩包

2023-11-19 18:25:45

使用 JavaScript 有效导出大量 Excel 文件为 ZIP 压缩包

背景

在当今数字化驱动的工作流程中，数据处理效率至关重要。前端开发人员经常面临将大量 Excel 文件导出为单个 ZIP 压缩包的挑战。本文将介绍一种创新的解决方案，利用 JavaScript（JS）、ExcelJS、File-Saver 和 JSZip 库，以满足这一需求。

ExcelJS：打造 Excel 工作簿

ExcelJS 库提供了强大的 API，可轻松创建、操纵和导出 Excel 工作簿。它使添加、编辑和格式化工作表、数据和样式变得轻而易举。即使是复杂的 Excel 文件，使用 ExcelJS 也能得心应手。

File-Saver：文件存储救星

File-Saver 库赋予了将数据保存为文件（包括 Excel 文件）的能力。它提供了灵活的选项，可指定文件名、文件类型和编码。跨平台兼容性极佳，确保现代浏览器均可使用。

JSZip：压缩文件的利器

JSZip 库专门处理 ZIP 压缩文件。它提供了丰富的功能，可创建、添加和提取 ZIP 存档中的文件。凭借 JSZip，可轻松创建多层级文件夹、添加包含多个工作表的 Excel 文件，并压缩整个存档。

解决方案架构

该解决方案包含以下步骤：

创建并填充 Excel 工作簿 ：使用 ExcelJS 创建和填充工作簿。
导出 Excel 工作簿 ：将工作簿导出为二进制数据。
保存 Excel 工作簿 ：使用 File-Saver 将二进制数据保存为临时文件。
创建 ZIP 存档 ：使用 JSZip 创建一个 ZIP 存档。
添加 Excel 文件 ：将临时 Excel 文件添加到 ZIP 存档。
压缩并下载 ：压缩 ZIP 存档并触发下载。

示例代码

以下代码展示了如何使用 ExcelJS、File-Saver 和 JSZip 批量导出 Excel 文件为 ZIP 压缩包：

async function exportExcelToZip() {
  // 创建 Excel 工作簿
  const workbook = new Excel.Workbook();

  // 填充工作簿
  await populateWorkbook(workbook);

  // 导出 Excel 工作簿
  const binaryData = await workbook.xlsx.writeBuffer();

  // 保存 Excel 工作簿
  const file = new File([binaryData], 'workbook.xlsx', { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });

  // 创建 ZIP 存档
  const zip = new JSZip();

  // 添加 Excel 文件
  await zip.file('workbook.xlsx', file);

  // 压缩 ZIP 存档
  const zipData = await zip.generateAsync({ type: 'blob' });

  // 触发下载
  saveAs(zipData, 'output.zip');
}