HTML5 Object tag with base64 data content causes Chrome to crash

Question

I am using the HTML5 FileReader to read a local file. I then want to immediately display the file contents within the browser, prior to uploading to the server.

I r

Answer 1

You should highly consider using a blob URL instead of a data URL. You're not actually manipulating the bytes of the file, so there is no reason to read the entire file into memory, then add a 33% overhead of base64 encoding it as a data URL.

window.URL = window.URL || window.webkitURL;

var file = filelist[0];
var url = window.URL.createObjectURL(file);
var html = '';
if (file.type && file.type.match('image/.*')) {
  html += '<img src="' + url + '" />';
}
....