基于Express与Archiver实现服务器向客户端浏览器发送Zip文件

嗨，作为Node.js新手能想到用Express搭配Archiver来做这个需求，已经找对方向啦！我来帮你把代码补全，再梳理清楚关键细节，确保你能顺利实现功能。

首先，先确认你已经安装了所需依赖，如果还没装，执行下面的命令：

npm install express archiver

接下来是完整的路由代码，我把你的片段补全并添加了关键的错误处理和示例：

const express = require('express');
const archiver = require('archiver');
const router = express.Router();

router.get('/image-dl', function(req, res) {
  // 修复你代码里的响应头拼写问题，正确设置下载相关的头信息
  res.setHeader('Content-Type', 'application/zip');
  // 指定下载后的文件名，这里可以根据你的需求修改
  res.setHeader('Content-Disposition', 'attachment; filename="my-download.zip"');

  // 创建Zip压缩实例，设置最高压缩级别（zlib level 9）
  const archive = archiver('zip', {
    zlib: { level: 9 }
  });

  // 必须监听压缩过程中的错误，避免服务器因未处理的错误崩溃
  archive.on('error', (err) => {
    res.status(500).send(`压缩出错：${err.message}`);
  });

  // 将压缩流直接管道到响应对象，实现流式传输（不用先存服务器磁盘）
  archive.pipe(res);

  // 这里添加你要压缩的内容，下面给几个常见示例：
  // 示例1：添加单个文件，第二个参数可以重命名文件在Zip里的名称
  // archive.file('./public/images/photo1.jpg', { name: 'photos/photo1.jpg' });

  // 示例2：添加多个文件
  // archive.file('./docs/report.pdf', { name: 'documents/report.pdf' });
  // archive.file('./assets/icon.png', { name: 'icons/main-icon.png' });

  // 示例3：添加整个目录，第二个参数是目录在Zip里的显示名称
  // archive.directory('./public/gallery/', 'gallery-images');

  // 完成压缩操作，触发流的结束
  archive.finalize();
});

module.exports = router;

关键细节说明： #

• 响应头修复：你之前的代码里Content-disposition拼写有误（应该是Content-Disposition，首字母大写），而且filename的拼写也没写完，这个是触发浏览器下载的关键，一定要正确设置。
• 流式传输优势：用archive.pipe(res)直接把压缩流传给客户端，不需要先在服务器生成完整的Zip文件再发送，既节省磁盘空间，又能更快开始传输。
• 错误处理：一定要监听archive的error事件，否则如果压缩过程中出现文件找不到等错误，会导致请求挂起，浏览器一直处于加载状态。
• 压缩内容灵活配置：Archiver支持添加单个文件、多个文件、整个目录，你可以根据自己的需求替换示例里的代码，注意文件/目录的路径要正确（相对于你的项目根目录）。

测试的时候，直接在浏览器访问你的路由地址（比如http://localhost:3000/image-dl），浏览器就会自动触发下载操作啦！

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