getting max Data-Uri size in Javascript

Question

I want to export data as a Data URI, only if the size of the data doesn't exceed the max size of the Data URI supported by the current browser is bigger than the file I want to download.

document.location.href= "data:application/vnd.openxmlformats-officedocument.wordprocessingml.document;base64,"+data

This sometimes results in a Browser error when the file is too big, but I wish that the error could be catched before the download (to try an other method for example).

How can I get the max Data-URI size in JS ?

Answer 1

I have decided to hardcode this table:

Here's the script I use to test the maxsize:

String.prototype.repeat = function( num )
{
    return new Array( num + 1 ).join( this );
}

testDataURI=function(size) 
{
    window.open("data:text/plain,"+"a".repeat(size-16))
}


testDataURI(100000) //test 100k characters

JSFIDDLE

Results:

1. Chrome (as of version 28): works with 2 097 152 Bytes, which is exactly 2 MB
2. Firefox (as of version 26): works with 1 040 000 Bytes, which is probably 1 MB

Answer 2

What about good old hardcode? :-)

I also can imagine some js test, hence it's not reliable and requires server communication at least once and probably not very dependable since it also can vary on browser implementation as well as on the possibility of the server to handle long urls (but at least you know it for your server). Anyway here it is: load static html page from your server (with http headers to cache it forever on client, non varying by request params) into hidden iframe or just with ajax get. So for example you know that target url ("data:application...") is 3000 symbols length. Than you build fake url of the same length to your static html http://yourserver.com/test.html?param1=param1&param2=param2&.. and try to load it. If the load succeeds than it's fine to open real url.

All in all I think that the hardcode is not so bad in this case.