"Save Image As" File Name for Inline Data URLs [Solved]
-
I am generating a number of images in javascript using canvas elements, then using the canvas.toDataURL function to set the source on image elements that are displayed to the client. I am using image elements since I want the user to be able to save the image (only available in Firefox on canvas elements, currently). The problem is that, when the user clicks "Save Image As", the name of the file comes up as "download.png" (Chrome 35), "index.png" (FF 30), "untitled.png" (IE 11), or "Unknown" (Safari 5.1.7). I have attempted to set the id, name, alt, and title attributes on the img tag, all of which appear to have no effect on the save as name. Is there any way in any of the major browsers to set a file name when the user attempts to save an image who's source is an inline data url? Thanks,
Sounds like somebody's got a case of the Mondays -Jeff
-
I am generating a number of images in javascript using canvas elements, then using the canvas.toDataURL function to set the source on image elements that are displayed to the client. I am using image elements since I want the user to be able to save the image (only available in Firefox on canvas elements, currently). The problem is that, when the user clicks "Save Image As", the name of the file comes up as "download.png" (Chrome 35), "index.png" (FF 30), "untitled.png" (IE 11), or "Unknown" (Safari 5.1.7). I have attempted to set the id, name, alt, and title attributes on the img tag, all of which appear to have no effect on the save as name. Is there any way in any of the major browsers to set a file name when the user attempts to save an image who's source is an inline data url? Thanks,
Sounds like somebody's got a case of the Mondays -Jeff
There's nothing in the RFC[^], and Wikipedia[^] explicitly states:
Data URIs do not carry a file name as a normal linked file would. When saving, a default file name for the specified MIME type is generally used.
The only suggestion I've seen is to use an
<a>tag with thedownloadattribute[^], but this won't work in any version of IE[^].<a href="data:image/png;base64,..." download="ImageFileName.png">download the image</a>
"These people looked deep within my soul and assigned me a number based on the order in which I joined." - Homer
