html - Data URI doesn't work with IE

Question

Im trying to dynamically create a CSV file using javascript that the user can download. This only has to work in IE.

The html the javascript generates looks something like this

 <a href="data:application/octet-stream,field1%2Cfield2%0Afoo%2Cbar%0Agoo%2Cgai%0A">CSV</a>

Which seams to work fine in chrome but IE10 just breaks.

Is there a better way to dynamically create a file using JavaScript and then give the user a link to download it? I cant use PHP as the entire system needs to run on the client-side due to restrictions placed by the user. The system all needs to work on a touch screen (with no right click option) so the link needs to give the user the ability to download, not open the file.

Answer 1

Internet Explorer 10 doesn't support the data protocol on the a element. Per the documentation, the only supported elements/attributes are the following:

• object (images only)
• img
• input type=image
• link
• CSS declarations that accept a URL, such as background, backgroundImage, and so on.

You should know that what you're attempting to do smells like a phishing attempt; for this reason you shouldn't expect browsers to support this pattern. You can read more about data-uri phishing in the paper Phishing by data URI.