How to read an archive in a Tabris.js app

Have you ever had to deal with a ZIP file in your mobile app? Since Tabris.js app developers have the npm ecosystem at hand, unzipping ZIP files in a cross-platform way is just a npm install away.

In this post, we are going to use the npm module jszip to print the contents of a zip file.

The zip file that we are going to read is available here. It has the following structure and contents:

.
├── a folder
│ └── message.txt (Hello world!)
└── another-message.txt (Hello earth!)

First, let’s download the archive:

Let’s see what it contains. loadAsync() reads the ZIP and provides information about the contained files. Its result has a forEach() method that can be used to iterate over the zip entries.

In this blog post, we want to print the content of every file in the zip, so the folder entry is not interesting for us. Let’s filter it out.

That’s better! Let’s read the file contents as text and print them to the console:

That’s it!

Here is the full example code:

Fiddle with this example and run it in the Tabris.js delevoper app (Android/iOS) now:

Open in Gitpod

Stay tuned for a follow-up on how to unpack the contents of the ZIP file to the device file storage in a worker!