node通过archiver实现打包下载

Node使用archiver实现多文件打包下载

技术:vue.js、node、archiver
在这里插入图片描述

直接上经典代码

部分页面代码:

<ul>
   <li v-for="(item,i) in newsDetail.filePath" :key="i">
       <a :href="item" :download="newsDetail.fileName[i]"><i :class="newsDetail.fileType[i]"></i>
           {{newsDetail.fileName[i]}}</a>
   </li>
</ul>
<p v-if="newsDetail.filePath.length > 0">
   <button class="btn btn-sm btn-primary" @click="downloadPackage">一键下载</button>
</p>
<p>
   <h4 class="mt-5">当前无可下载资源</h4>
</p>

下载的js代码:

$.post("/package/packageZip", {   // 路径为后台打包的路径
    dirList: this.newsDetail.filePath  // dirList当前打包内容路径列表  数据就不写了
}).then(res => {
    console.log(res);
    if (res.code != 200) {                        // 后台返回错误信息
        layer.msg("由于网络原因,打包下载失败");          
        return;
    }
    var id = Date.now() + "DOWNLOAD";     // 下载按钮的Id
    $(`<a id="${id}" href='${res.data.packagePath}' download=''></a>`).appendTo("body"); // 创建下载按钮
    var e = document.createEvent("MouseEvents");  // 添加事件
    e.initEvent("click", true, true);
    document.getElementById(id).dispatchEvent(e);   //  执行
})

!!!Node!!!

1.首先需要安装archiver的依赖包

	npm install archiver 

2.我在后端对文件的名字做的md5加密所以引入了md5模块

	npm install md5

3.重要的一个东西---- fs 模块

router.post("/packageZip", (req, res) => {
  var dirList = req.body.dirList;
  console.log(dirList);
  // 创建一个加密后的文件名
  var fileName = MD5(dirList.join() + Date.now()).substr(0, 18);
  // 创建一个输出路径
  var output = fs.createWriteStream(
    __dirname + "/../public/download/" + fileName + ".zip"
  );
  // 处理压缩的级别
  var archive = archiver("zip", {
    zlib: { level: 9 }  
  });
 
  output.on("close", function() {
    console.log(archive.pointer() + " total bytes"); 
  });
 
  output.on("end", function() {
    console.log("Data has been drained");
  });
  // 打包异常返回前端错误状态码
  archive.on("warning", function(err) {
    if (err.code === "ENOENT") {
      // log warning
      console.log(err);
      res.send({
        code: 201,
        message: "当前网络可能存在问题,暂时无法打包"
      });
      return;
    } else {
      // throw error
      console.log(err);
      res.send({
        code: 201,
        message: "由于网络原因,打包失败"
      });
      return;
    }
  });
 //  打包错误返回前端状态码
  archive.on("error", function(err) {
    console.log(err);
    res.send({
      code: 201,
      message: "由于网络原因,打包失败"
    });
    return;
  });
  // 输出压缩包到指定的文件
  archive.pipe(output);
  // 将前端传过来的文件路径对应的文件追加到压缩包中
  dirList.forEach((v, i) => {
    archive.append(fs.createReadStream(__dirname + "/../public/" + v), {
      name: Date.now() + i + v.substr(v.lastIndexOf("-") + 1)
    });
  });
  // 至此  压缩完成
  archive.finalize();
	
  // 在这里返回打包后的压缩包路径供下载 
  res.send({
    code: 200,
    message: "打包成功,等待下载",
    data: {
      packagePath: "/download/" + fileName + ".zip"
    }
  });
});

当时写的一个垃圾设计,英语学习网,有什么不对的,大佬们多多指点啊!!!!!!!

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值