开始使用JavaScript下载文件

Question

假设我的网站上有文件下载链接。单击这些链接后，会将AJAX请求发送到服务器，该请求返回带有文件位置的URL。我想做的是，当响应返回时，指示浏览器下载文件。有便携式的方法吗？

Answer 1

我们这样做：首先添加此脚本。

<script type="text/javascript">

function populateIframe(id,path) 

{

    var ifrm = document.getElementById(id);

    ifrm.src = "download.php?path="+path;

}

</script>

将其放置在您想要下载按钮的位置（此处我们仅使用链接）：

<iframe id="frame1" style="display:none"></iframe>

<a href="javascript:populateIframe('frame1','<?php echo $path; ?>')">download</a>

文件“ download.php”（需要放在您的服务器上）仅包含：

<?php 

   header("Content-Type: application/octet-stream");

   header("Content-Disposition: attachment; filename=".$_GET['path']);

   readfile($_GET['path']);

?>

因此，当您单击链接时，隐藏的iframe就会获取/打开源文件“ download.php”。以路径作为get参数。我们认为这是最好的解决方案！

应该注意的是，该解决方案的PHP部分只是一个简单的演示，可能非常非常不安全。它允许用户下载任何文件，而不仅仅是预定义的文件。这意味着他们可以下载网站本身的部分源代码，其中可能包含API凭据等。

Answer 2

我创建了一个开源的jQuery File Download插件（带有示例的演示）（GitHub），它也可以帮助您解决问题。它与iframe的工作方式非常相似，但具有一些很酷的功能，我发现它们非常方便：

• 用户永远不会离开从其启动文件下载的同一页面。此功能对于现代Web应用程序变得至关重要

• 经过测试的跨浏览器支持（包括移动设备！）

• 它以类似于jQuery AJAX API的方式支持POST和GET请求

• successCallback和failCallback函数使您可以清楚地了解两种情况下用户看到的内容

• 结合jQuery UI，开发人员可以轻松地向用户显示模式文件，告知用户正在下载文件，可以在下载开始后解散该模式，甚至可以以友好的方式通知用户发生了错误。有关此示例，请参见演示。