encode/decode image with base64 breaks image

Question

I am trying to encode and decode an image. I am using the FileReader\'s readAsDataURL method to convert the image to base64. Then to convert it back I have tried using

Answer 1

After some more research I found the answer from here I basically needed to wrap the raw binary in an arraybuffer and convert the binary chars to Unicode.

This is the code that was missing,

    var binaryImg = atob(base64Image);
    var length = binaryImg.length;
    var ab = new ArrayBuffer(length);
    var ua = new Uint8Array(ab);
    for (var i = 0; i < length; i++) {
        ua[i] = binaryImg.charCodeAt(i);
    }

The full sample code is here