Как стать автором
Обновить

JSZip Создаем .zip файлы

Время на прочтение 3 мин
Количество просмотров 23K
Очень хороший и простой способ отдать клиенту несколько файлов в zip архиве. Не нагружая и без того нагруженный сервер.
var zip = new JSZip();
zip.add("Hello.txt", "Hello World\n");
img = zip.folder("images");
img.add("smile.gif", imgData, {base64: true});
content = zip.generate();
location.href="data:application/zip;base64,"+content;

Итак давайте разберем, что тут происходит.
Создается экземпляр нашего zip архива, класс JSZip,.
Далее мы можем добавлять в него любые данные, допустим Hello.txt, также можно добавить папку images.
Далее положить в нее smile.gif, все это завернуть, и отдать вам как zip фаил.

Поддерживаемые Браузеры


Opera Firefox Safari Chrome
7.5+ Имя файла «default.zip» 3.0+ Имя файла набор из символов алфавита с расширением ".part" Имя файла «Unknown» ( у меня Загруженное ) без расширения Имя файла «download.zip»

Думаю про IE я промолчу :)

Документация



new JSZip([compressionMethod])

Конструктор.

compressionMethod, строка. Метод компрессии используемый в .zip файле.
Доступные методы.
«STORE» без компрессии, по умлочанию.
«DEFLATE» стандартная zip компрессия, нужен файл jszip-deflate.js
var zip = new JSZip(); // тоже что и new JSZip("STORE");
var zip = new JSZip("DEFLATE");


add(name, data [,options])

Добавить файл в наш zip архив. Поддерживает цепочку (chaining)

Опции (options)
base64, булево. Поставьте в true если data кодирована в base64. К примеру картинка из canvas.
binary, булево. По умолчанию в true если data в base64, иначе false
date, Дата. Используйте чтобы установить дату последнего изменения файла. Иначе будет использовано текущее время.

zip.add("Hello.txt", "Hello World\n");
zip.add("smile.gif", "R0lGODdhBQAFAIACAAAAAP/eACwAAAAABQAFAAACCIwPkWerClIBADs=", {base64: true});
zip.add("magic.txt", "U2VjcmV0IGNvZGU=", {base64: true, binary: false});
zip.add("Xmas.txt", "Ho ho ho !", {date : new Date("December 25, 2007 00:00:01")});

zip.add("animals.txt", "dog,platypus\n").add("people.txt", "james,sebastian\n");

Результат: Hello.txt, smile.gif, magic.txt, Xmas.txt, animals.txt, people.txt

folder(name)

Добавить директорию в zip архив. Поддерживает цепочку (chaining)
zip.folder("images");
zip.folder("css").add("style.css", "body {background: #FF0000}");
// or specify an absolute path (using forward slashes)
zip.add("css/font.css", "body {font-family: sans-serif}")

Результат: images/, css/, css/style.css, css/font.css

find(needle)

Сравнить строку или регулярное выражение со всеми именами файлов и вернуть объект с информацией по каждому совпадению.
zip.add("Readme", "Hello World!\n");
zip.add("Readme.French", "Bonjour tout le monde!\n");
zip.add("Readme.Pirate", "Ahoy m'hearty!\n");

zip.find("Readme"); // only finds "Readme"
zip.find(/^Readme/); // Regular expression finds all three

Результат: Массив со всеми совпадениями вида: {name: «Readme», data: «Hello World!», dir: false}

remove(name)

Удалить файл или папку
<source lang=«javascript>
zip.add(»Hello.txt", «Hello World\n»);
zip.add(«temp.txt», «nothing»).remove(«temp.txt»);

Результат: Hello.txt
zip.add("Hello.txt", "Hello World\n");
zip.folder("css").add("style.css", "body {background: #FF0000}");
zip.remove("Hello.txt").remove("css");

Результат: Empty.zip

generate(asBytes = false)

Генерирует zip архив. По умолчанию кодированный в base64, передайте true чтобы получить 'голую' byte строку.
content = zip.generate();
location.href="data:application/zip;base64,"+content;
content = zip.generate(true);
for (var c = 0; c < content.length; c++)
{
    console.log(content.charCodeAt(c));
    // do other things
}


Сайт: jszip.stuartk.co.uk
Github: github.com/Stuk/jszip



Материал подготовлен в редакторе «Руки&Клавиатура»
Теги:
Хабы:
+54
Комментарии 34
Комментарии Комментарии 34

Публикации

Истории

Работа

Ближайшие события

Московский туристический хакатон
Дата 23 марта – 7 апреля
Место
Москва Онлайн
Геймтон «DatsEdenSpace» от DatsTeam
Дата 5 – 6 апреля
Время 17:00 – 20:00
Место
Онлайн