JavaScript 将 Canvas 数组转换为图片并打包下载为 Zip 文件

你可以使用 HTML5 的 canvas 元素的 toDataURL 方法将 canvas 转换为图片的 base64 编码，然后使用 jszip 库将 base64 编码的图片添加到 zip 文件中。以下是一个示例代码：

// 创建一个 Zip 对象
var zip = new JSZip();

// 循环遍历 canvas 数组
for (var i = 0; i < canvasArray.length; i++) {
  var canvas = canvasArray[i];

  // 将 canvas 转换为 base64 编码的图片
  var dataURL = canvas.toDataURL('image/png');

  // 移除 dataURL 中的头部信息
  var base64Data = dataURL.replace(/^data:image/(png|jpg);base64,/, '');

  // 将 base64 编码的图片添加到 Zip 文件中
  zip.file('image' + i + '.png', base64Data, { base64: true });
}

// 生成 Zip 文件
var content = zip.generate({ type: 'blob' });

// 创建下载链接并下载 Zip 文件
var link = document.createElement('a');
link.href = URL.createObjectURL(content);
link.download = 'images.zip';
link.click();

需要注意的是，这里使用了 jszip 库来操作 Zip 文件，所以在使用前需要先引入 jszip 库。