我怎么知道文件下载/"Save As"提示何时出现？

Question

网页上有一个链接

<a class="btn btn-success" href="DownloadCsv">Download CSV</a>

当用户点击该链接时，服务器响应标题Content-Disposition: attachment，提示用户"保存文件"对话框。

我想要完成的是:在服务器生成响应时禁用链接，并在服务器响应后启用链接。

服务器是否为该响应触发了任何事件?或者有其他的方法来实现这一点吗?

Answer 1

我想到的唯一方法是使用AJAX。您首先使用AJAX下载它，其中有指导您的事件(如就绪状态等)。然后进行实际的下载，但此时它是从浏览器缓存中提供的。所以它实际上不是下载的，而是立即从磁盘加载的。用户不会看出区别，但您将能够检测到实际下载的结束

Answer 2

我重温了我以前的问题。我甚至不记得我需要它做什么，但我决定现在回答这个问题，因为它在3.5年之后还没有解决…可以这样完成

链接可以是

<a class="btn btn-success" onclick="clickHandler(this); return false;">Download CSV</a>

处理程序

    function clickHandler(element) {
        //disable link
        var href = element.href;
        element.href = 'javascript:void(0)';
        //download file
        var xhr = new XMLHttpRequest();
        xhr.open('GET', 'DownloadCsv', true);
        xhr.responseType = 'arraybuffer';
        xhr.onload = function(e) {
          if (this.status == 200) {
            var uInt8Array = new Uint8Array(this.response);
            var i = uInt8Array.length;
            var binaryString = new Array(i);
            while (i--) { binaryString[i] = String.fromCharCode(uInt8Array[i]); }
            var data = binaryString.join('');
            //initiate save as dialog
            var base64 = window.btoa(data);
            var a = document.createElement('a'); 
            a.href = 'data:application/csv;base64,'+ base64; 
            a.setAttribute('download', 'data.csv');
            a.click();
            //enable link
            element.href = href;
          }
        };
        xhr.send(); 
    }