Search code examples
javascripthtmlimagebase64url

Where does the save name of an image come from when it's src is base64

When an <img> comes from the server the src attribute contains the name of the image when you right-click/"Save image as".

<img src="/myimage.jpg">

If you've created an <img> with a base64 encoding, the src name is not useful.

<img src="data:image/jpeg;base64,/9j/4AAQSkZ...">

  • When I right-click/"Save image as" in Chrome desktop, the name is always "download.jpg"

  • When I long-press in iOS/Safari I get no opportunity to see or save a name, but it gives it a unique name that's in keeping with all other images taken (e.g. "IMG_00xx.JPG" Note: I can only see this if I hook the iPhone to a computer and browse pictures. There's no interface to see the name on the actual device!)

  • When I long-press in Chrome/Android a name related to the last '/' seen in the src with a ".bin" extension is used (e.g. "9bx=.bin")

Is there a way to give the browser a name to use?

This answer (from '11) suggests, "No." Save As prompt "image name" in generic handler.ashx ?

Nine years later I'm hoping for some progress.

Solution

  • Use <a download="myimage.jpg" href="data:image/jpeg;base64,/9j/4AAQSkZ...">Download Image</a> instead.