首页 > 其他分享 >js:JSZip实现前端浏览器压缩文件成zip格式

js:JSZip实现前端浏览器压缩文件成zip格式

时间:2023-08-07 11:36:44浏览次数:39  
标签:saveAs 压缩文件 zip FileSaver JSZip content jszip js


文档

CDN引入

<!-- jszip.js -->
<script
  src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/jszip/3.7.1/jszip.min.js"
  type="application/javascript"
></script>

<!-- FileSaver.js -->
<script
  src="https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/FileSaver.js/2014-08-29/FileSaver.min.js"
  type="application/javascript"
></script>

npm

安装

npm install jszip

使用示例

import JSZip from 'jszip'
import FileSaver from 'file-saver'

const zip = new JSZip()

zip.file('Hello.txt', 'Hello World\n')

zip.generateAsync({ type: 'blob' }).then(function (content) {
    // see FileSaver.js
    // 如果在浏览器CDN方式引入,直接使用 saveAs
    // saveAs(content, 'example.zip')
    FileSaver.saveAs(content, 'example.zip')
})


标签:saveAs,压缩文件,zip,FileSaver,JSZip,content,jszip,js
From: https://blog.51cto.com/mouday/6991942

相关文章

  • 详解Nodejs中的Process对象
    在Nodejs中,process是一个全局对象,它提供了与当前进程和运行时环境交互的方法和属性。通过process对象,我们可以访问进程的信息、控制流程和进行进程间通信,这些都是服务端语言应该具备的能力。本文将全面介绍process对象的使用场景,从基础概念到高级应用,带有代码示例,让您深入了解它的......
  • 学习Node.js的基础知识和核心概念(全面)
    Node.js,这个神奇的技术,融合了前端与后端的力量,让JavaScript在服务器端发挥了异乎寻常的魔力。本文将通过代码和文字解释,全面介绍Node.js的特点,从异步非阻塞I/O到强大的模块系统,再到丰富的包管理和事件驱动编程,一步步揭开Node.js的神秘面纱。公众号:Code程序人生,个人网站:https://crea......
  • 用Node.js搭建一个简单Web服务器
    Node.js是基于ChromeV8引擎的JavaScript运行时环境,它允许我们在服务器端运行JavaScript代码,这让我们可以用JavaScript构建Web服务器,处理请求和响应。我们一起探索了如何用Node.js搭建一个简单但强大的Web服务器!什么是Nodejs在搭建Web服务器之前,先让我们了解一下今天的主角Nodejs。......
  • js:使用LetterAvatar通过canvas实现浏览器中生成字母头像
    实现效果LetterAvatar的原理就是利用了浏览器对象canvas在线体验:https://mouday.github.io/tools/pages/letter-avatar/index.htmlLetterAvatar.js完整代码/**LetterAvatar**ArturHeinze*CreateLetteravatarbasedonInitials*basedonhttps://gist.github.co......
  • Nodejs安装教程
    1.下载地址下载地址:https://nodejs.org/zh-cn/download/,根据自己需求选择下载  2.安装1.双击安装包,一直点击【下一步】2.点击change按钮,更换到自己的指定安装位置,点击【下一步】3.一直点击【下一步】,最后安装成功即可3.配置环境变量Node.js安装完成后,我们需要设置环境......
  • 基于NodeJS游戏交流社区系统的设计与实现
    随着社会的发展,社会的各行各业都在利用信息化时代的优势。计算机的优势和普及使得各种信息系统的开发成为必需。游戏交流社区系统,主要的模块包括查看首页、个人中心、用户管理、游戏类型管理、游戏信息管理、游戏攻略管理、交流论坛、系统管理等功能。系统中管理员主要是为了安全有......
  • node js 目录操作
    一、创建目录1、语法以下为创建目录的语法格式:fs.mkdir(path[,options],callback)2、参数参数使用说明如下:path -文件路径。options参数可以是:recursive -是否以递归的方式创建目录,默认为false。mode -设置目录权限,默认为0777。callback -回调函......
  • Nodejs 第四章(Npm install 原理)
    在执行npminstall的时候发生了什么?首先安装的依赖都会存放在根目录的node_modules,默认采用扁平化的方式安装,并且排序规则.bin第一个然后@系列,再然后按照首字母排序abcd等,并且使用的算法是广度优先遍历,在遍历依赖树时,npm会首先处理项目根目录下的依赖,然后逐层处理每个依赖包的依......
  • Nodejs 第五章(Npm run 原理)
    npmrunxxx发生了什么按照下面的例子npmrundev举例过程中发生了什么读取packagejson的scripts对应的脚本命令(dev:vite),vite是个可执行脚本,他的查找规则是:先从当前项目的node_modules/.bin去查找可执行命令vite如果没找到就去全局的node_modules去找可执行命令vite如果还......
  • Nodejs 第六章(npx)
    npx是什么npx是一个命令行工具,它是npm5.2.0版本中新增的功能。它允许用户在不安装全局包的情况下,运行已安装在本地项目中的包或者远程仓库中的包。npx的作用是在命令行中运行node包中的可执行文件,而不需要全局安装这些包。这可以使开发人员更轻松地管理包的依赖关系,并且可以避免全......