How to download a file without using <a> element with download attribute or a server?

Question

According to caniuse the download attribute of <a> element is supported at Microsoft Edge build 10547+, but not IE or Safari.

How to download a file object without using <a> element with download attribute set or a server?

Answer 1

There are a number of ways of triggering a download. Following are a few:

Use a form:

<form method="get" action="mydoc.doc">
<button type="submit">Download</button>
</form>

Use javascript:

<button type="submit" onclick="window.open('mydoc.doc')">Download</button>

Answer 2

Although I support @LeoFarmer's answer, I would like to offer two "hackable" approaches:

1. If the file is very small, you can use a with the href='data:[<mediatype>][;base64],<data>'.

   This could allow you to add content disposition in the mediatype, emulating an HTTP header. This hack is also not as portable as one might hope.

2. On small to medium files, it's possible to download the file using AJAX, and then use the Javascript File API to prompt for file saving (the API doesn't support saving, but it's easy to convert the data to a data URL).

   If you want to avoid the Javascript File API, you can try emulating an anchor click, as suggested here.

Again, as pointed out by Leo Farmer, these solutions can't promise that the browser won't open the file in a new tab instead of saving it to the disk, but I think it's safe to say that all users will be able to gracefully degrade to a cmd+S or ctrl+S keyboard shortcut :-)