微信小程序 - 创建 ZIP 压缩包

news2024/11/18 11:19:32

微信小程序 - 创建 ZIP 压缩包

  • 场景
  • 分享代码片段
  • 导入 JSZip
  • 创建ZIP文件
  • 追加写入文件
  • 测试方法
  • 参考资料

场景

微信小程序只提供了解压ZIP的API,并没有提供创建ZIP的方法。
当我们想把自己处理好的保存,打包ZIP保存下来时就需要自己实现了。

分享代码片段

不想听废话的,直接看代码
https://developers.weixin.qq.com/s/ChblKjmo7ZNd

在这里插入图片描述

导入 JSZip

首先需要 jszip

const JSZip = require('../lib/jszip.min');
const fs = wx.getFileSystemManager();

jszip 在微信小程序无法直接跑。要处理一下。把 setImmediate 全部替换为 setTimeout
在这里插入图片描述

创建ZIP文件

/**
 * 文件打包为 zip
 * @param {*} fileList 文件列表 [{ name: '文件名', path: '文件路径'}]
 * @param {*} zipPath  保存压缩包的路径
 * @param {*} progress 处理进度更新时:回调
 */
async function zip(fileList, zipPath, progress=res=>console.log){
  try {
    // 实例化 jszip
    var jszip = new JSZip();
    // 遍历文件列表,添加到 zip 文件列表中
    let total = fileList.length;
    fileList.forEach((file, index) => {
      jszip.file(file.name, new Uint8Array(fs.readFileSync(file.path)));
      progress({ percent: Math.round((index+1)/total) * 100, msg: `读取资源 ${index+1}/${total}` });
    });
    // 生成压缩包对象(uint8array)
    let content = await jszip.generateAsync(
      { type : JSZip.support.uint8array ? "uint8array" : "string" },
      meta => progress({ percent: Math.floor(meta.percent), msg: `创建 ZIP...` }) // { currentFile: '', percent: 100 }
    );
    // 将 arrayBuffer 形式压的缩包数据写入二进制文件,生成 zip
    progress({ percent: 0, msg: `保存 ZIP...` }); // 开始
    // 分块写入
    await appendFile({ 
      filePath: zipPath, 
      data: content.buffer, 
      encoding: 'binary', 
      progress: percent => progress({ percent: Math.floor(percent), msg: `保存 ZIP...` })
    }).then(() => {
      progress({ percent: 100, msg: `ZIP 保存完成` });
    }).catch(err => {
      console.error('写入文件失败:', err);  
    });
  } catch (err) {
    console.log(err);
  }
}

追加写入文件

/**
 * 追加写入文件
 * @param {string} filePath     文件路径
 * @param {string} data         写入数据
 * @param {string} encoding     编码类型:默认 utf8
 * @param {number} chunkSize    写入块大小:默认 1048576 字节
 * @param {function} progress   更新进度回调
 */
function appendFile(options) { 
  let { filePath, data, encoding, chunkSize, progress } = Object.assign({
    encoding: 'utf8',     // 编码类型,默认 utf8。想写二进制用 'binary'
    chunkSize: 1048576,   // 每块大小默认 1M
    progress: console.log // 更新进度
  }, options);

  // 文件总长度
  const fileLength = data instanceof ArrayBuffer ? data.byteLength : data.length;  

  // 文件小于 chunkSize 直接写
  if(fileLength <= chunkSize){
    return new Promise((resolve, reject) => {
      try {
        resolve(fs.writeFileSync( filePath, data, encoding ));
      } catch (error) {
        reject(error);
      }      
    });
  }else{
    // 否则分块写入,并调用进度更新 callback
    return new Promise((resolve, reject) => {
      // 先写入一个空文件。(作用:有则清空,无则创建)
      fs.writeFileSync(filePath, new ArrayBuffer(0), encoding);
      // 已写入长度
      let writtenLength = 0;
      // 写入数据块
      const writeChunk = () => {
        const chunkData = data.slice(writtenLength, writtenLength + chunkSize); // 切段
        fs.appendFile({  
          filePath,         // 文件路径
          data: chunkData,  // 数据块
          encoding,         // 编码类型
          success: () => {  
            writtenLength += chunkSize; // 更新已写入长度
            progress( Math.floor((writtenLength / fileLength) * 100)); // call回调函数更新进度  
            if (writtenLength < fileLength) {  
              writeChunk();  // 继续写入下一块数据  
            } else {  
              resolve(writtenLength);  // 文件写入完成:返回写入长度
            }  
          },  
          fail: err => reject(err) 
        });  
      };
      // 继续调用写入数据块
      writeChunk();  
    });
  }
}

测试方法

test(){
    const zipFolder = `${wx.env.USER_DATA_PATH}/test`;
    const zipPath = `${zipFolder}/hello.zip`;
    let fileList = [];
    try {
      // 先创建对应目录
      fileUtil.mkdir(zipFolder);
      // 生成测试文件
      for (let index = 0; index < 10; index++){
        let filePath = `${wx.env.USER_DATA_PATH}/test/hello${index}.txt`;
        fileList.push({ name: `hello${index}.txt`, path: filePath});
        const res = fs.writeFileSync( filePath, `测试数据${index+1}`, 'utf8' );
        console.log(res);
      }
      // 打包 zip
      fileUtil.zip(fileList, zipPath, console.log);
      // 保存 zip
      wx.saveFileToDisk({ filePath: zipPath, success: console.log, fail: console.error });
    } catch(e) {
      console.error(e)
    }
  }

参考资料

jszip:一个使用JavaScript创建、读取和编辑.zip文件的库,带有一个可爱而简单的API。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1294927.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

freeswitch如何解决sip信令的NAT问题

概述 freeswitch是一款简单好用的VOIP开源软交换平台。 公网环境复杂多变&#xff0c;客户环境更是各种稀奇古怪的问题。 fs在针对sip信令的NAT问题有针对性的参数设置。 本文讨论的范围限于fs的公网地址正常没有在NAT后面的两种常见场景。其他更多更复杂的NAT场景暂不讨论…

滴滴公布故障原因

故障原因公布&#xff1a; “底层系统软件发生故障” 业界传闻是因 “K8s升级版本错误导致”。 巧的是&#xff0c;在 10 月 17 日 “滴滴技术” 发布的《滴滴弹性云基于 K8S 的调度实践》一文中&#xff0c;也刚好有介绍滴滴从 K8s 1.12 到 1.20 跨版本升级的方案。在替换方案…

喜讯!云起无垠上榜《成长型初创企业推荐10强》

近期&#xff0c;由中国计算机学会抗恶劣环境计算机专业委员会、信息产业信息安全测评中心和安全牛联合发起的第十一版《中国网络安全企业100强》榜单正式发布。在这份备受关注的榜单中&#xff0c;云起无垠凭借其创新的技术能力&#xff0c;荣登《成长型初创企业推荐10强》榜单…

FPGA入门有多难?这篇文章让你吃透零基础入门技巧!

FPGA是一个高度集成化的芯片&#xff0c;其学习过程既需要编程&#xff0c;又需要弄懂硬件电路和计算机架构。涉及到的知识和基础非常多&#xff0c;如果不合理地安排学习内容&#xff0c;学习过程会非常漫长和枯燥。这使很多想要学习FPGA小伙伴望而却步&#xff0c;那么&#…

RHEL8_Linux网络时间服务器

本章主要介绍网络时间服务器 使用chrony配置时间服务器配置chrony客户端向服务器同步时间 1.时间同步的必要性 一些服务对时间要求非常严格&#xff0c;例如&#xff0c;图20-1所示的由三台服务器搭建的ceph集群。 这三台服务器的时间必须保持一致&#xff0c;如果不一致&…

如何选择合适的运筹优化求解器?

文章目录 前言求解器对比问题延伸&#xff1a;商用求解器和开源求解器的差别是什么&#xff1f; 求解器PK总结参考资料 前言 求解器对于运筹算法工程师而言&#xff0c;常常像一个黑盒&#xff0c;我们扔进去输入数据和数学模型&#xff0c;求解器给我们吐出一个解出来。这种状…

类与对象的概念:创建及调用方法

掌握类和创建对象的关系 定义类 定义对象 定义和调用方法 编程思想&#xff1a;面向过程编程&#xff0c;面向对象编程 系统提供数据类型【String&#xff0c;char&#xff0c;double】&#xff0c;我们也可以自己定义类型&#xff1a;根据自定义类型所衍生出来的变量就是…

【推荐系统】推荐算法数学基础

【大家好&#xff0c;我是爱干饭的猿&#xff0c;本文重点介绍推荐系统涉及的数学知识、推荐系统涉及的概率统计知识。 后续会继续分享其他重要知识点总结&#xff0c;如果喜欢这篇文章&#xff0c;点个赞&#x1f44d;&#xff0c;关注一下吧】 上一篇文章&#xff1a;《【推…

RocketMq顺序消息

RocketMq顺序消息 1.RocketMq 架构图2.RocketMq顺序消息2.1部分消息有序2.1.1 生产者构建2.1.2 生产者保证有序2.1.3 消费者保证有序性 3.使用rocketmq-spring-boot-starter发送消息如何指定tag与key?问题1.MessagingException: sendDefaultImpl call timeout 1.RocketMq 架构…

高精度加法,减法,乘法,除法(下)(C语言)

前言 上一篇博客我们分享了高精度加法&#xff0c;减法,这一期我将为大家讲解高精度乘法和高精度除法。那让我们开始吧&#xff01; 对加法和减法感兴趣的话就点我 文章目录 1&#xff0c;乘法2&#xff0c;除法3&#xff0c;尾声 1&#xff0c;乘法 让我们想想我们平时做数学…

STC15F100E单片机模拟串口

文章目录 一、芯片简介二、开发环境三、软件模拟串口参考 一、芯片简介 STC15F100系列单片机是宏晶科技生产的单时钟/机器周期(1T)的单片机&#xff0c;新一代8051单片机&#xff0c;指令代码完全兼容传统8051&#xff0c;但是速度快6-12倍。 内部集成R/C时钟&#xff0c;5MHz…

52 代码审计-PHP项目类RCE及文件包含下载删除

目录 漏洞关键字:演示案例:xhcms-无框架-文件包含跨站-搜索或应用-includeearmusic-无框架-文件下载-搜索或应用功能-down等zzzcms-无框架-文件删除RCE-搜索或应用-unlink、eval 漏洞关键字: SQL注入&#xff1a; select insert update mysql_query mysql等 文件上传&#xff…

守护安全,六氟化硫气体泄漏报警装置校准服务

在电力工业中&#xff0c;六氟化硫&#xff08;SF6&#xff09;气体是一种重要的介质&#xff0c;它用作封闭式中、高压开关的灭弧和绝缘气体。六氟化硫气体的卓越性能实现了装置经济化、低维护化的操作。与普通装置相比&#xff0c;可以节省最多90&#xff05;的空间。 六氟化…

Themis: Fast, Strong Order-Fairness in Byzantine Consensus

目录 笔记后续的研究方向摘要引言秩序井然 Themis: Fast, Strong Order-Fairness in Byzantine Consensus CCS 2023 笔记 后续的研究方向 摘要 我们介绍了Themis&#xff0c;这是一种将交易的公平排序引入&#xff08;许可的&#xff09;拜占庭共识协议的方案&#xff0c;最…

ubuntu系统下搭建本地物联网mqtt服务器的步骤

那么假如我们需要做一些终端设备&#xff0c;例如温湿度传感器、光照等物联网采集设备要接入呢&#xff1f;怎么样才能将数据报送到服务器呢&#xff1f; 以下内容基于我们ubuntu系统下的emqx成功启动的基础上。我们可以用浏览器键入控制板的地址&#xff0c;如果启动成功&…

python pyaudio显示音频波形图

python pyaudio显示音频波形图 代码如下&#xff1a; import numpy as np import matplotlib.pylab as plb import wave# 读取 wav wf wave.open("./output.wav", "rb")# 获取音频相关参数&#xff1a;声道数、量化位数、采样频率、采样帧数 nchannels,…

案例二:SQL Server数据库的备份和还原

1、备份类型。 在 SQL Server 中提供了三种常用的备份类型&#xff0c;分别是完整备份&#xff0e;差异备份和事务日志备份。 完整备份&#xff1a; 完整备份包括对整个数据库、部分事务日志、数据库结构和文件结构的备份。完整备份代表的是备份完成时刻的数据库。 完整备份是…

「Verilog学习笔记」格雷码计数器

专栏前言 本专栏的内容主要是记录本人学习Verilog过程中的一些知识点&#xff0c;刷题网站用的是牛客网 timescale 1ns/1nsmodule gray_counter(input clk,input rst_n,output reg [3:0] gray_out );reg [3:0] binary_cnt ; reg flag ; always (posedge clk or negedge r…

【高效开发工具系列】Mac删除启动台图标

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…