Crear ficheros zip en JavaScript

El formato ZIP es el tipo de archivo más utilizado a la hora de comprimir datos y transportar información. Existe un amplio abanico de posibilidades para generar este tipo de archivos. La mayoría de los lenguajes de programación suelen ofrecer algún tipo de librería para trabajar con estos archivos. Lenguajes como Java o PHP ofrecen todo lo necesario para trabajar con ellos.

Lo que no es tan habitual es encontrar librerías de script que trabajan al lado del navegador y que sean capaces de crear archivos .ZIP. Hoy os traemos una librería creada en JavaScript que nos permitirá realizar este tipo de acciones y que recibe el nombre de JSZIP.

Veamos a continuación un ejemplo de cómo funciona esta librería.

Lo primero que debemos hacer es incluir la librería JavaScript en el documento HTML donde queremos crear el archivo comprimido. Esta librería nos la podemos descargar de su sitio oficial.


<script type="text/javascript" src="https://raw.github.com/Stuk/jszip/master/jszip.js"></script>


Lo siguiente que hacemos es crear el código encargado de generar el archivo .ZIP

Lo primero que hay que hacer es crear el objeto encargado de manejar la creación del archivo. Esto lo hacemos con la siguiente línea:


var zip = new JSZip();


Añadimos los archivos que estarán dentro del zip que estamos creando. En este caso estamos añadiendo un archivo TXT con el texto “Hola Mundo”.


zip.add("hello1.txt", "Hola Mundon");


También podríamos añadir imágenes sueltas o dentro de una carpeta. En nuestro ejemplo añadiremos un GIF dentro de la carpeta “imagenes”. Para ello primero creamos la carpeta:


var img = zip.folder("images");


Luego le añadimos la imagen a ese directorio que hemos creado.


img.file("smile.gif", imgData, {base64: true});


Una vez que hemos añadido todos los archivos, generamos el zip


Content = zip.generate();


Por último lanzamos la descarga del archivo que hemos generado.

location.href="data:application/zip;base64," + content;

Si juntamos todo, quedaría algo como lo siguiente.

var zip = new JSZip();
zip.add("hello1.txt", "Hello First Worldn");
var img = zip.folder("images");
img.file("smile.gif", imgData, {base64: true});
content = zip.generate();
location.href="data:application/zip;base64," + content;

Según sus creadores, esta librería es compatible con todos los navegadores modernos, incluso con Internet Explorer desde su versión 6.

Sitio oficial JSZip
COMPARTE ESTA NOTICIA

COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN LINKEDIN
COMPARTIR EN WHATSAPP