检测浏览器何时收到文件下载

Question

检测浏览器何时收到文件下载我有一个允许用户下载动态生成文件的页面。这需要很长时间来生成，所以我想显示一个“等待”指示器。问题是，我不知道如何检测浏览器何时收到文件，所以我可以隐藏指示符。我以一种隐藏的形式发出请求，该请求发布到服务器，并针对隐藏的iframe获取其结果。这样我就不会用结果替换整个浏览器窗口了。我在iframe上听一个“Load”事件，希望它在下载完成后启动。我返回一个“内容处理：附件”头与文件，这导致浏览器显示“保存”对话框。但是浏览器不会在iframe中触发“Load”事件。我尝试过的一种方法是使用多部分响应。因此，它将发送一个空的HTML文件，以及附加的可下载文件。例如：Content-type: multipart/x-mixed-replace;boundary="abcde"--abcdeContent-type: text/html--abcdeContent-type:  application/vnd.fdfContent-Disposition: attachment; filename=foo.fdf file-content--abcde这在Firefox中是可行的；它接收空的HTML文件，触发“Load”事件，然后显示可下载文件的“Save”对话框。但是它在IE和Safari上失败；IE触发“Load”事件，但不下载文件，Safari下载文件(名称和内容类型错误)，并且不触发“Load”事件。另一种方法可能是调用启动文件创建，然后轮询服务器直到它准备就绪，然后下载已经创建的文件。但我宁愿避免在服务器上创建临时文件。有人有更好的主意吗？

Answer 1

我使用以下方法下载BLOB并在下载后撤销对象-url。它工作在铬和火狐！

function download(blob){
    var url = URL.createObjectURL(blob);
    console.log('create ' + url);

    window.addEventListener('focus', window_focus, false);
    function window_focus(){
        window.removeEventListener('focus', window_focus, false);                   
        URL.revokeObjectURL(url);
        console.log('revoke ' + url);
    }
    location.href = url;}

文件下载对话框关闭后，窗口将恢复她的焦点，从而触发Focus事件。

Answer 2

一个非常简单的(和跛脚)一行解决方案是使用window.onblur()事件以关闭加载对话框。当然，如果时间太长，用户决定做其他事情(比如阅读电子邮件)，加载对话框就会关闭。