Question

假设我们有一个pdf链接“http://manuals.info.apple.com/en/iphone_user_guide.pdf”（仅举例来说，让你知道我的服务器上没有该文件，我只有链接）...现在我必须提供一个按钮我的网站将下载该文件。

我尝试了各种各样的东西，比如window.open，href等方法，但是它打开了其他窗口上的链接。我知道这是因为现在所有的浏览器都带有一个adobe插件，可以在另一个窗口打开它，但仍然没有任何方式我给用户提供下载选项而不是打开它，通过客户端脚本编写..

帮助.. 谢谢

Answer 1

这是一个 Javascript 解决方案（对于像我这样寻找标题答案的人来说）：

function SaveToDisk(fileURL, fileName) {
    // for non-IE
    if (!window.ActiveXObject) {
        var save = document.createElement('a');
        save.href = fileURL;
        save.target = '_blank';
        save.download = fileName || 'unknown';

        var evt = new MouseEvent('click', {
            'view': window,
            'bubbles': true,
            'cancelable': false
        });
        save.dispatchEvent(evt);

        (window.URL || window.webkitURL).revokeObjectURL(save.href);
    }

    // for IE < 11
    else if ( !! window.ActiveXObject && document.execCommand)     {
        var _window = window.open(fileURL, '_blank');
        _window.document.close();
        _window.document.execCommand('SaveAs', true, fileName || fileURL)
        _window.close();
    }
}

来源：http://muaz-khan.blogspot.fr/2012/10/save-files-on-disk-using-javascript-or.html

不幸的是，我使用的是IE11，它不接受新的MouseEvent。在这种情况下我使用以下内容：

//...
try {
    var evt = new MouseEvent(...);
} catch (e) {
    window.open(fileURL, fileName);
}
//...

Answer 2

使用HTML5“下载”属性

<a href="iphone_user_guide.pdf" download="iPhone User's Guide.PDF">click me</a>

警告：截至撰写本文时，在IE / Safari中无效，请参阅：caniuse.com/#search=download

编辑：如果您正在寻找实际 javascript解决方案，请参阅lajarre's answer

Answer 3

使用JavaScript，即使不是不可能，也很困难（？）。我建议使用某种代码隐藏语言，如PHP，C＃或Java。如果您使用PHP，您可以在按钮发布的页面中执行以下操作：

<?php
header('Content-type: application/pdf');
header('Content-disposition: attachment; filename=filename.pdf');
readfile("http://manuals.info.apple.com/en/iphone_user_guide.pdf");
?>

这似乎也适用于JS（来自http://www.phpbuilder.com/board/showthread.php?t=10149735）：

<body>
<script>
function downloadme(x){
myTempWindow = window.open(x,'','left=10000,screenX=10000');
myTempWindow.document.execCommand('SaveAs','null','download.pdf');
myTempWindow.close();
}
</script>

<a href=javascript:downloadme('http://manuals.info.apple.com/en/iphone_user_guide.pdf');>Download this pdf</a>
</body>

Answer 4

如果htaccess是一个选项，这将使所有PDF链接下载而不是在浏览器中打开

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

Answer 5

Here是使用javaScript下载文件的完美示例。

用法：download_file(fileURL, fileName);

Answer 6

在javascript中使用event args参数的preventDefault（）方法。

<a href="no-script.html">Download now!</a>

$('a').click(function(e) {
    e.preventDefault(); // stop the browser from following
    window.location.href = 'downloads/file.pdf';
});

Answer 7

使用Javascript，您可以通过一种简单的方法下载

var oReq = new XMLHttpRequest();
// The Endpoint of your server 
var URLToPDF = "https://mozilla.github.io/pdf.js/web/compressed.tracemonkey-pldi-09.pdf";
// Configure XMLHttpRequest
oReq.open("GET", URLToPDF, true);

// Important to use the blob response type
oReq.responseType = "blob";

// When the file request finishes
// Is up to you, the configuration for error events etc.
oReq.onload = function() {
// Once the file is downloaded, open a new window with the PDF
// Remember to allow the POP-UPS in your browser
var file = new Blob([oReq.response], { 
    type: 'application/pdf' 
});

// Generate file download directly in the browser !
saveAs(file, "mypdffilename.pdf");
};

oReq.send();

使用javascript / ajax / jquery强制下载pdf链接

7 个答案: