So I'm trying to create a basic prototype of a functionality. Essentially the end goal is to receive a Base64 encoded string and a support mime type and generate the file and serve it up from a HTML 5 APP. For now I'm working on simple getting a file, turning it into a Blob, and then displaying it, all from memory.

   var blobfile = atob(base64);

   window.blobFromBlob = new Blob([binaryString], {

     type: MIMEType

   });

   window.blobURL = URL.createObjectURL(window.blobFromBlob);

   var a = <a href= + window.blobURL + >Binary Blob Link</a>;

   document.getElementById('byte_content').innerHTML = a;

I've created a JSFiddle to show what I'm having trouble with. When I put, say a JPEG, into it and then try to serve it up the img tags show corrupt images. The Base64 blob I never expect to work, but the Binary blob and blob from base 64 I do expect to work.

Can anyone see where I'm going wrong?

Thanks!

NOTE: I managed to get the binary one to display by changing from readAsBinaryString to readAsArrayBuffer

NOTE 2: I'm beginning to suspect it has something to do with atob and btoa