Force external download url

Question

I want to host on my webpage an external url containing a mp3 file. The problem is that clicking on that link will open the player, i have to right click and \"Save link as\

Answer 1

Now the HTML5 spec defines a very useful download attribute on hyperlinks that basically allows to force download behavior on client-side, regardless of what comes in Content-Type and Content-Disposition from the server:

In some cases, resources are intended for later use rather than immediate viewing. To indicate that a resource is intended to be downloaded for use later, rather than immediately used, the download attribute can be specified on the a or area element that creates the hyperlink to that resource.

<...>

The download attribute, if present, indicates that the author intends the hyperlink to be used for downloading a resource. The attribute may have a value; the value, if any, specifies the default filename that the author recommends for use in labeling the resource in a local file system.

So all you need to do is add the attribute to your hyperlink and the browsers that support it would understand that the content needs to be downloaded:

Download Your File

You can even suggest a different name for the downloaded file by setting the attribute value:

Download Your File

More info and demos:

• Downloading resources in HTML5: a[download] (HTML5 Rocks)
• HTML5 download Attribute (David Walsh)

Browser support: caniuse.com

---

Downloading generated content

You can even make a link that will download a content that you generated, as long as there is a way to get a base64-encoded data URI for it:

Download

For more details on saving generated content, refer to this article by Eli Grey:

Saving generated files on the client-side