Shulou(Shulou.com)06/02 Report--

This article mainly explains "how to use JSZip to compress files and pictures", the content of the article is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in depth, together to study and learn "how to use JSZip to compress files and pictures" bar!

Introduction to JSZip

JSZip is a javascript library for creating, reading, and editing .zip files, with a lovely and simple API. JSZip supports installation and use of Nodejs and browser. The specific methods are as follows:

The npm install jszipnpm install file-saver browser decompresses the zip file

The back-end Nodejs stores the zip file in the database in binary form. When the zip file is needed at the current end, the backend transfers the zip file to the front end in binary form, and the front end decompresses it and restores it.

Use JSZip to compress the file import JSZip from 'jszip';import FileSaver from' file-saver';var zip = new JSZip ()

/ / create a hello.txt file with the content of Hello Worldzip.file ("hello.txt", "Hello World\ n")

/ / create a nested folder in which you create a hello.txt file with the contents of Hello Worldzip.folder ("nested"). File ("hello.txt", "Hello World\ n"); zip.generateAsync ({type: "blob"}). Then (function (content) {/ use file-saver to save and download the zip file

FileSaver.saveAs (content, `zip`);}); delete a file or folder through .remove (name): zip.remove ("photos"); / / delete its contents by deleting the folder. Extract the Zip file import JSZip from 'jszip'let new_zip = new JSZip (); new_zip.loadAsync (content) .then (function (zip) {new_zip.file ("hello.txt"). Async ("string");}); case: export a zip file containing the picture file and .json file / * * @ param dataList [' base64 data', 'base64 data'] * / function exportJSZipFileSaverEvent (dataList: any) {var zip = new JSZip () Var img = zip.folder ("images"); let myNotesName = 'zip name'; for (let I = 0; I < dataList.length; ilist +) {/ / filter base64 format let image = dataList [I]. Replace (/ ^ data:image\ / (png | jpg | jpeg); base64,/, "); let imageNames = `$ {myNotesName} ${getTime ()} (${i+ 1}) .png`; img?.file (imageNames, image, {base64: true}) / / Export json let jsonNames = `${myNotesName} ${getTime ()} (${I + 1}) .json`; zip.file (jsonNames, 'json text data');} / download zip.generateAsync ({type: "blob"}). Then (function (content) {FileSaver.saveAs (content,` ${myNotesName} ${getTime ()} .zip`);} function getTime () {let data = new Date () Return data.getFullYear () + "-" + (data.getMonth () + 1) + "-" + data.getDate ();} Thank you for reading, these are the contents of "how to use JSZip to compress files and pictures". After the study of this article, I believe you have a deeper understanding of how to use JSZip to compress files and pictures. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.