Jquery 下载文件插件不工作

Question

我想从服务器下载一个文件，一旦用户完成下载操作，我想将它从服务器中删除。因此，为此我使用了以下 Jquery 插件：

fileDownload

我的想法是我将在其回调函数中删除文件。您可以在下面找到代码片段：

 $.fileDownload(url, {
                contentType: "application/octet-stream",
                contentDisposition: 'attachment; filename=' + response.fileName
               })
               .done(function () {
                    console.log('File download a success!');
                })
               .fail(function () {
                    console.log('File download failed!');
                });

因此，当用户尝试下载文件时，主要出现以下错误：

它的回调函数没有正常工作，每次调用FAIL回调函数
尽管回调失败，但它没有下载文件，而是开始在浏览器 window 上播放 MP4 文件，我收到以下错误：

Resource interpreted as Document but transferred with MIME type video/mp4.

所以，主要有两个个问题：

每次调用失败回调方法
录制开始 PLAY 在浏览器上而不是 正在下载

或者，是否还有其他替代方法可以实现此目的？谢谢

Answer 1

Or, If there is any other alternative way to achieve this? thanks

尝试使用 XMLHttpRequest 并将 responseType 设置为 "blob"

function refocus() {                     
  document.body.removeChild(document.getElementById("download"));
  console.log("File download a success!");
  window.removeEventListener("focus", refocus)
}

var request = new XMLHttpRequest();
request.open("GET", "/path/to/mp4", true); 
request.responseType = "blob";
request.onload = function (e) {
    if (this.status === 200) {
        // create `objectURL` of `this.response` : `.mp4` as `Blob`
        var file = URL.createObjectURL(this.response);
        var a = document.createElement("a");
        a.href = file;
        a.download = this.response.name || "file-" + new Date().getTime();
        a.id = "download";
        document.body.appendChild(a);
        a.click();
        // remove `a` following `Save As` dialog, 
        // `window` regains `focus`
        window.addEventListener("focus", refocus, false);

    } else {
        console.log("File download failed!")
    }
};
request.send();

Jquery 下载文件插件不工作

Jquery Download File PlugIn Not Working

jquery

resources

mp4

download

jquery-plugins