Javascript/jQuery：文件下载就绪事件答案

【问题标题】：Javascript/jQuery: File download ready eventJavascript/jQuery：文件下载就绪事件
【发布时间】：2013-08-05 09:28:48
【问题描述】：

有没有办法知道关于文件准备下载的浏览器事件已经触发？我有一个生成文件的脚本，当这发生时，我显示了一个 laoding gif。一旦出现此消息：http://i.stack.imgur.com/CmZHE.png（文件可供下载，脚本已完成）我想停止 gif。

用 JS 可以知道吗？使用 ajax 是一种选择，但需要更长的时间，因为它需要对系统进行多次修改。

谢谢！

【问题讨论】：

在 AJAX 中你会怎么做？你是如何生成该文件的？在 JavaScript 中？
按照这个例子我几乎完成了：geekswithblogs.net/GruffCode/archive/2010/10/28/… 但是我怎样才能用 PHP 发送 cookie？它看起来像 cookie 发送，但 javascript 无法实时获取它（它只出现在下一次 html 重新加载时的 DOM 上）......有什么想法吗？我使用的是基本完全相同的代码，并使用 PHP 中的 setcookie() 发送 cookie。
我不确定，但是您可以尝试检查文件下载对话框出现时是否触发了onLoad事件。

标签： php javascript jquery browser

【解决方案1】：

我是按照这个例子做的：http://geekswithblogs.net/GruffCode/archive/2010/10/28/detecting-the-file-download-dialog-in-the-browser.aspx

对于 PHP，请注意这是发送 cookie 的方式：

header('Content-type: application/octet-stream');
header('Set-Cookie: fileDownload=1; path=/');
header('Content-Disposition: attachment; filename='.$filename);

上面的路径真的很重要。那么JS也需要移除cookie的路径，像这样：

$.removeCookie('fileDownload', { path: '/' })

【讨论】：

【解决方案2】：

我遇到了同样的问题，并分两步选择了解决方案。

我认为这是一个很好的解决方案，可以在准备文件时显示和隐藏 spinner.gif 和/或等待消息，直到准备开始下载。

首先，我使用 jQuery 修改我的锚点，以通过 ajax bby 在我的 uri 上添加 ?cmd=prepare 来调用我的下载功能。这将在服务器端准备我的 PDF 并将其存储在客户端可访问的文件夹中（例如 domain.ext/documents/my_pdf_name.pdf）。

HTML（引导程序 3）：

<a href="/search/download" class="btn btn-primary pull-left download">
    <i class="fa fa-file-pdf-o"></i> Download result in PDF
</a>

jQuery :

$(function() {
    $('.download').on('click', function(e) {
        e.preventDefault();
        $('.loading').show();
        url = $('.download').attr('href') + '?cmd=prepare';
        $.ajax({
            url: url,
            type: 'get',
            success: function(filename) {
                console.log(data);
                window.location = filename;
                $('.loading').hide();
            }
        });
    });
});

PHP服务器端：

// ajax call
if(addslashes($_GET["cmd"]) == "prepare") {
    echo create_pdf($_SESSION["search"], $out="prepare");
    die();    
}

当文件准备好时，函数 create_pdf() 将返回文件名给客户端，并且在我的 ajax 查询成功函数中，我调用 window.location = filename 显示“另存为窗口”。

在服务器端准备文档是用ajax调用的，但下载不是！

此解决方案导致的问题是存储您不想保留在服务器上的文件。因此，您可以使用 bash 脚本删除超过 x 小时的文件。例如https://stackoverflow.com/a/249591/2282880

【讨论】：