jszip
Version:
Create, read and edit .zip files with Javascript http://stuartk.com/jszip
91 lines (78 loc) • 2.82 kB
HTML
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>JSZip example : get zip filw with XHR</title>
<link media="screen" href="style.css" type="text/css" rel="stylesheet">
</head>
<body>
<h1><a href="../">JSZip</a> example : get a file with an ajax call</h1>
<p>Tip : check the source of the page !</p>
<h2>The xhr1 way</h2>
<div id="xhr1_way"></div>
<h2>The xhr2 way, with arraybuffer</h2>
<div id="xhr2_way_arraybuffer"></div>
<h2>The xhr2 way, with blob</h2>
<div id="xhr2_way_blob"></div>
<script type="text/javascript" src="../dist/jszip.js"></script>
<script type="text/javascript">
(function () {
//=========================
// XHR1
//=========================
var xhr1 = new XMLHttpRequest();
xhr1.open('GET', '../test/ref/text.zip', true);
if (xhr1.overrideMimeType) {
xhr1.overrideMimeType('text/plain; charset=x-user-defined');
}
xhr1.onreadystatechange = function(e) {
if (this.readyState == 4 && this.status == 200) {
var zip = new JSZip(this.responseText);
var elt = document.getElementById('xhr1_way');
elt.innerHTML = "<p>loaded ! (as a " + (typeof this.responseText) + ")</p>";
elt.innerHTML += "<p>Content = " + zip.file("Hello.txt").asText();
}
};
xhr1.send();
//=========================
// XHR2, arraybuffer
// Can't use jQuery :(
// http://bugs.jquery.com/ticket/11461
//=========================
var xhr2_arraybuffer = new XMLHttpRequest();
xhr2_arraybuffer.open('GET', '../test/ref/text.zip', true);
xhr2_arraybuffer.responseType = 'arraybuffer';
xhr2_arraybuffer.onreadystatechange = function(e) {
if (this.readyState == 4 && this.status == 200) {
var zip = new JSZip(this.response);
var elt = document.getElementById('xhr2_way_arraybuffer');
elt.innerHTML = "<p>loaded ! (as a " + this.response + ")</p>";
elt.innerHTML += "<p>Content = " + zip.file("Hello.txt").asText();
}
};
xhr2_arraybuffer.send();
//=========================
// XHR2, blob
// Can't use jQuery :(
// http://bugs.jquery.com/ticket/11461
//=========================
var xhr2_blob = new XMLHttpRequest();
xhr2_blob.open('GET', '../test/ref/text.zip', true);
xhr2_blob.responseType = 'blob';
xhr2_blob.onreadystatechange = function(e) {
if (this.readyState == 4 && this.status == 200) {
var elt = document.getElementById('xhr2_way_blob');
elt.innerHTML = "<p>loaded ! (as a " + this.response + ")</p>";
var reader = new FileReader();
reader.onload = function (e) {
var zip = new JSZip(e.target.result);
elt.innerHTML += "<p>Content = " + zip.file("Hello.txt").asText();
};
reader.readAsArrayBuffer(this.response);
}
};
xhr2_blob.send();
})();
</script>
</body>
</html>