Cara Membuat Zip Files dengan JavaScript

Sementara kita melakukan hal-hal menakjubkan dengan JavaScript pada sisi server, penting untuk tidak mengambil mata kita dari beberapa hal-hal besar terjadi pada sisi klien. Salah satu proyek tersebut mengagumkan yang saya baru saja ditemukan adalah pada JSZip: sebuah perpustakaan JavaScript yang memungkinkan Anda untuk dengan mudah menghasilkan ZIP file dari front-end. Dan mengapa itu berguna? Anda dapat memungkinkan pengguna untuk memilih dan men-download gambar dari galeri atau hanya tentang apa pun. Mari kita lihat bagaimana JSZip memungkinkan Anda untuk menghasilkan file Zip terstruktur dari sisi klien!

Mulai dengan meraih JSZip library, yang terjadi untuk bekerja di semua browser utama. Setelah Perpustakaan tersedia dalam halaman, menghasilkan sebuah file Zip adalah benar-benar hanya beberapa baris kode:





var zip = new JSZip();

// Add an top-level, arbitrary text file with contents
zip.file("Hello.txt", "Hello World\n");

// Generate a directory within the Zip file structure
var img = zip.folder("images");

// Add a file to the directory, in this case an image with data URI as contents
img.file("smile.gif", imgData, {base64: true});

// Generate the zip file asynchronously
zip.generateAsync({type:"blob"})
.then(function(content) {
// Force down of the Zip file
saveAs(content, "archive.zip");
});


Anda dapat menambahkan individu file dengan nama-nama kustom dan isi, serta direktori sewenang-wenang. Setelah isi Anda ditambahkan, JSZip asynchronously dapat menghasilkan Zip file dan Anda kemudian dapat memicu download.

Anda juga dapat memuat dan membaca file Zip:

var read_zip = new JSZip();
// Load zip content; you'd use fetch to get the content
read_zip.loadAsync(content)
.then(function(zip) {
// Read from the zip file!
read_zip.file("hello.txt").async("string"); // a promise of "Hello World\n"
});


Saya sangat menghargai kesederhanaan JSZip's. Ada library yang lebih canggih dan rumit yang tersedia, seperti zip.js, tetapi JSZip kemungkinan akan mencakup sebagian kasus penggunaan. Salah satu contoh dari mengambil keuntungan dari file Zip di sisi klien di Service Worker Cookbook: cache file Zip lokal, memekarkan isinya, dan melayani dalam pekerja layanan. Apa pun Anda menggunakan kasus, tahu bahwa file Zip dapat membaca dan dihasilkan tanpa memerlukan server!

Disclaimer: Gambar, artikel ataupun video yang ada di web ini terkadang berasal dari berbagai sumber media lain. Hak Cipta sepenuhnya dipegang oleh sumber tersebut. Jika ada masalah terkait hal ini, Anda dapat menghubungi kami disini.
Related Posts
Disqus Comments