Node配合Vue实现压缩文件并在浏览器中下载(升级版)

最新推荐文章于 2025-04-12 08:00:00 发布

幸运程序员

最新推荐文章于 2025-04-12 08:00:00 发布

阅读量342

点赞数 6

文章标签： vue.js javascript 前端 node.js 前端框架

本文链接：https://blog.csdn.net/qq_42046017/article/details/138225649

版权

本文介绍了如何使用Node.js配合Vue.js实现升级版文件压缩功能，用户可以选择单个文件，Node接收请求后在指定目录下查找并压缩，最后通过浏览器下载。涉及到jszip库的使用以及Node端的路由和控制器逻辑处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Node配合Vue实现压缩文件并在浏览器中下载(升级版)

之前我写了“Node实现压缩文件并下载”，那个是最基础的版本，这次升级版需求变了，需要选择一个文件然后传给Node，Node接收到在指定目录下找到需要下载的单个目录，而不是整个了，并且这次是多层目录。

注意：需要安装jszip包，npm install jszip

Vue端

<template>
  <div>
    <!--  省略列表选择代码  -->
    <button @click="downloadZip">Download Zip</button>
  </div>
</template>

<script>
import {
    downloadFile } from '@/services/api'
export default {
   
  data() {
   
    // ...省略
  },
  methods: {
   
    downloadZip() {
   
      // 从 Node请求压缩文件，downloadFile是封装的接口，结合自己项目进行调整
      // this.currentSelectLoadout.FileName是我们最后选择的文件名
      downloadFile(this.currentSelectLoadout.FileName

最低0.47元/天解锁文章