html save image button

Question

I am creating an app that involves letting the user import and export photos. I believe I have importing worked out fine using

<input type="file" />

but I cannot find a way to create an export button that functions in a similar way. As in, it brings up the directory listing as lets the user choose where to save the picture that is currently being displayed.

Answer 1

You can't directly trigger a "Save as" dialog from a web application, but you can serve the image in a way that will make the browser do it.

You need to send the Content-Type (mime type) to something like image/jpeg and Content-Disposition to something like attachment; filename="fname.ext" attachment; filename="fname.ext"

As Kevin B suggested, you can accomplish this using PHP. I don't think there's a way to do it with only JavaScript.