(HTML) Download a PDF file instead of opening them in browser when clicked

(HTML) Download a PDF file instead of opening them in browser when clicked

I was wondering how to make a PDF file link downloadable instead of opening them in the browser? How is this done in html? (I’d assume it’s done via javascript or something).

Solutions/Answers:

Solution 1:

You can’t do this with HTML. It’s a server-based solution. You have to stream the file so that the browser than triggers the save dialog.

I’d advise not doing this. How a user interacts with a PDF should be left up to the user.

UPDATE (2014):

So…this answer still gets plenty of downvotes. I assume part of that is that this was answered 4 years ago and as Sarim points out, there is now the HTML 5 download attribute that can handle this.

I agree, and think Sarim’s answer is good (it probably should be the chosen answer if the OP ever returns). However, this answer is still the reliable way to handle it (as Yiğit Yener’s answer points out and–oddly–people agree with). While the download attribute has gained support, it’s still spotty:

http://caniuse.com/#feat=download

Solution 2:

With html5, it is possible now. Set a “download” attr in element.

<a href="http://link/to/file" download="FileName">Download it!</a>

Source : http://updates.html5rocks.com/2011/08/Downloading-resources-in-HTML5-a-download

Solution 3:

This is only possible with setting a http response header by the server side code. Namely;

Content-Disposition: attachment; filename=fname.ext

Solution 4:

You need to change the http headers sent. Depending on your server, you can modify your .htaccess as follows:

<FilesMatch "\.(?i:pdf)$">
  ForceType application/octet-stream
  Header set Content-Disposition attachment
</FilesMatch>

Solution 5:

you will need to use a PHP script (or an other server side language for this)

<?php
// We'll be outputting a PDF
header('Content-type: application/pdf');

// It will be called downloaded.pdf
header('Content-Disposition: attachment; filename="downloaded.pdf"');

// The PDF source is in original.pdf
readfile('original.pdf');
?>

and use httacces to redirect (rewrite) to the PHP file instead of the pdf

Solution 6:

You can use

Response.AddHeader("Content-disposition", "attachment; filename=" + Name);

Check out this example:

http://www.codeproject.com/KB/aspnet/textfile.aspx

This goes for ASP.NET. I am sure you can find similar solutions in all other server side languages. However there’s no javascript solution to the best of my knowledge.