How do i read png files in a zip #417
-
How do i read png files in a zip. At the moment i have it in the form of an entry when you unzip the zip file and i want to get it into a png file |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments
-
Here is a simple example of code which displays all the png files found in a zip file. <!doctype html>
<html>
<head>
<title>Display png files from a zip file</title>
</head>
<body>
<form>
<input type=file accept=.zip id=zipFileInput>
</form>
<div id=imagesElement>
</div>
<script type=module>
import { ZipReader, BlobReader, BlobWriter } from "https://unpkg.com/@zip.js/zip.js/index.js";
zipFileInput.onchange = () => displayImages().catch(error => alert(error));
async function displayImages() {
const zipReader = new ZipReader(new BlobReader(zipFileInput.files[0]));
const entries = await zipReader.getEntries();
await Promise.all(entries.map(async entry => {
if (entry.filename.endsWith(".png")) {
const imageElement = document.createElement("img");
imageElement.src = URL.createObjectURL(await entry.getData(new BlobWriter("image/png")));
imageElement.onload = () => imagesElement.appendChild(imageElement);
}
}));
}
</script>
</body>
</html> |
Beta Was this translation helpful? Give feedback.
-
thanks it worked for me. |
Beta Was this translation helpful? Give feedback.
Here is a simple example of code which displays all the png files found in a zip file.