(HTML)下载 PDF 文件，而不是在浏览器中单击时打开它们

小开

这种行为应该取决于如何设置浏览器来处理各种 MIME 类型。在这种情况下，MIME 类型是 application/pdf。如果要强制浏览器下载该文件，可以尝试对 PDF 文件强制使用不同的 MIME 类型。我建议不要这样做，因为这应该是用户选择当他们打开一个 PDF 文件时会发生什么。

小开

这只有通过服务器端代码设置 http 响应头才可能实现

Content-Disposition: attachment; filename=fname.ext

小开

您将需要使用一个 PHP 脚本(或其他服务器端语言)

<?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');
?>

并使用 httacces 重定向(重写)到 PHP 文件，而不是 pdf 文件

小开

你可以用

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

看看这个例子:

Http://www.codeproject.com/kb/aspnet/textfile.aspx

这是针对 ASP.NET 的。我相信您可以在所有其他服务器端语言中找到类似的解决方案。然而，据我所知，目前还没有 javascript 解决方案。

小开

最佳答案

现在有 HTML 5 download属性可以处理这个问题。

我同意，并且认为 Sarim 的答案是好的(如果 OP 再次出现，它可能应该是被选择的答案)。然而，这个答案仍然是处理这个问题的可靠方法(正如 Yit Yener 的答案所指出的，而且——奇怪的是——人们也同意)。虽然下载属性已经得到了支持，但是它仍然参差不齐:

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

小开

对我来说最有效的解决方案是 Nick 在他的博客上写的那个

他的解决方案的基本思想是使用 Apache 服务器头模块并编辑。Htaccess 中包含一个 FileMatch 指令，强制所有 * 。Pdf 文件作为一个流而不是一个附件。虽然这实际上并不涉及编辑 HTML (根据最初的问题) ，但它本身并不需要任何编程。

我更喜欢 Nick 的方法的第一个原因是因为它允许我在每个文件夹的基础上设置它，这样一个文件夹中的 PDF 文件仍然可以在浏览器中打开，同时允许其他文件(我们希望用户编辑然后重新上传的文件)被强制作为下载。

我还想补充一点，PDF 有一个选项，可以通过 API 向您的服务器发布/提交可填写的表单，但这需要一段时间来实现。

第二个原因是因为时间是一个考虑因素。编写一个 PHP 文件处理程序来强制在 header ()中处理内容也将比 API 花费更少的时间，但仍然比 Nick 的方法花费更长的时间。

如果您知道如何打开 Apache mod 并编辑。你可以在大约10分钟内得到这个。它需要 Linux 托管(而不是 Windows)。这可能不是适合所有用途的方法，因为它需要高级服务器访问来配置。因此，如果您提到访问，那可能是因为您已经知道如何做这两件事。如果没有，查看尼克的博客获得更多指导。

小开

现在可以使用 html5了，在元素中设置一个“ download”attr。

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

资料来源: http://updates.html5rocks.com/2011/08/Downloading-resources-in-HTML5-a-download

小开

对于在特定文件夹中使用动态名称创建并由 IIS 服务的文件，我需要这样做。

这对我很有效:

在 IIS 中，转到该文件夹并双击 HTTP 响应头。
添加一个包含以下信息的新标题:

名称: 内容-处置价值: 附件

(来自: http://forums.iis.net/t/1175103.aspx?add+CustomHeaders+only+for+certain+file+types+)

小开

如果没有 html5属性，可以通过使用 php 实现这一点:

使用以下代码创建名为下载的 php 文件:

<?php
ob_start();
$file = "yourPDF.pdf"


if (file_exists($file))
{
header('Content-Description: File Transfer');
header('Content-Type: application/octet-stream');
header('Content-Disposition: attachment; filename='.basename($file));
header('Content-Transfer-Encoding: binary');
header('Expires: 0');
header('Cache-Control: must-revalidate');
header('Pragma: public');
header('Content-Length: ' . filesize($file));
ob_clean();
flush();
readfile($file);
exit();
}

现在，如果你想自动开始下载 pdf，写下这个 javascript:

<script>window.location = "download.php";</script>

如果你想让这个链接起作用，就用这个..。

<a href='javascript:window.location = "download.php"'>
Download it!
</a>

小开

如果您正在使用 HTML5(我猜现在每个人都在使用它) ，那么有一个称为 download的属性。

<a href="somepathto.pdf" download="filename">

在这里 filename是可选的，但如果提供，它将采用这个名称为下载的文件。

小开

由于 html5方式(我以前的答案)并不适用于所有浏览器，这里有另一种稍微有点黑客的方式。

这个解决方案要求您从同一个域提供预期的文件，OR 具有 CORS 权限。

首先通过 XMLHttpRequest (Ajax)下载文件的内容。
然后通过 base64对文件内容进行编码，生成一个数据 URI，并将 media-type 设置为 application/octet-stream。结果应该是

data:application/octet-stream;base64,SGVsbG8sIFdvcmxkIQ%3D%3D

现在设置 location.href = data。这将导致浏览器下载该文件。不幸的是，您不能这样设置文件名或扩展名。摆弄媒体类型可能会产生一些结果。

详见: https://developer.mozilla.org/en-US/docs/Web/HTTP/data_URIs

小开

当你想直接从浏览器下载任何图片或 pdf 文件，而不是打开它在新标签，然后在 javascript 你应该设置值下载属性的创建动态链接

    var path= "your file path will be here";
var save = document.createElement('a');
save.href = filePath;
save.download = "Your file name here";
save.target = '_blank';
var event = document.createEvent('Event');
event.initEvent('click', true, true);
save.dispatchEvent(event);
(window.URL || window.webkitURL).revokeObjectURL(save.href);

对于新的 Chrome 更新，某些时间事件不起作用。下面的代码将被使用

  var path= "your file path will be here";
var save = document.createElement('a');
save.href = filePath;
save.download = "Your file name here";
save.target = '_blank';
document.body.appendChild(save);
save.click();
document.body.removeChild(save);

添加和删除子 Internet Explorer 对于只支持浏览器的 Firefox 非常有用。在铬，它将工作没有附加和删除子

小开

可以使用 download.js (https://github.com/rndme/download和 http://danml.com/download.html)。如果文件位于外部 URL 中，则必须发出 Ajax 请求，但如果不是，则可以使用函数:

download(Path, name, mime)

在 GitHub 中阅读他们的文档了解更多细节。

小开

您可以添加以下代码

<a href='http://v2.immo-facile.com/catalog/admin-v2/product_info.pdf' class='btnPdf' title='pdf'  target='_blank' type='application/pdf' >Télécharger la fiche du bien</a>

小开

@ Aljohn Yamaro

function forceDownload(pdf_url, pdf_name) {
var x = new XMLHttpRequest();
x.open("GET", pdf_url, true);
x.responseType = 'blob';
x.onload = function(e){
saveAs(x.response, pdf_name, 'application/pdf');
};
x.send();
}

小开

对于创建 a DOM 元素并设置 download属性的建议解决方案，我遇到了一些问题。它在一些浏览器中仍然显示弹出警告(也许到2021年它们变得更加严格了)。

将 pdf mime 类型添加到 href属性解决了浏览器弹出警告问题，但是它搞乱了文件(下载的文件受损，无法打开)。

在2021年，您可以下载 PDF 文件没有浏览器警告，没有 PHP 或 Apache 设置，使用 XMLHttpRequest的建议，由 Edhowler。不过，他的代码示例使用了一个 npm 库。以下是仅使用 js 的方法:

/**
* Download a file without browser popup warning
* @param {string} url The url of the file to download
* @param {string} filename Set a new filename for the downloaded file (optional)
*/
const downloadFile = (url, filename = '') => {
if (filename.length === 0) filename = url.split('/').pop();
const req = new XMLHttpRequest();
req.open('GET', url, true);
req.responseType = 'blob';
req.onload = function () {
const blob = new Blob([req.response], {
type: 'application/pdf',
});


const isIE = false || !!document.documentMode;
if (isIE) {
window.navigator.msSaveBlob(blob, filename);
} else {
const windowUrl = window.URL || window.webkitURL;
const href = windowUrl.createObjectURL(blob);
const a = document.createElement('a');
a.setAttribute('download', filename);
a.setAttribute('href', href);
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
}
};
req.send();
};


downloadFile('https://domain.tld/file.pdf');

如果您需要对非 ES6 + 浏览器的支持，可以使用像 Babel 这样的传输器。