Crazy JavaScript hack: unzipping a file

Handling binary data is slowly getting better in JavaScript, but in most browsers, people still have to resort to amazingly clever hacks when it comes to things like unzipping a file stored on a server. Here are the steps that are involved (slide 38). I suspect that you will never need to do this, but it is still fun to see what is possible.

• Read the binary data of the ZIP file from the server via XMLHttpRequest. You need to specify a charset x-user-defined to ensure that each byte stays a single character.
• Translate the binary data to base 64 and turn it into a PNG data URI. PNG is zipped internally, so if you get the header right, the web browser will unzip the data as soon as the image is drawn somewhere.
• Draw the image into a Canvas object, with a height of 1 pixel. Read the uncompressed data from the Canvas, pixel by pixel.