使用JQuery使用加载器或进度表下载Excel或其他二进制文件,而无需使用Cookies

问题描述

在不使用cookie的情况下,如何使用JQuery下载Excel或其他二进制文件时如何向用户显示“正在加载”小部件或进度表?

解决方法

    $.ajax(url,{
        xhrFields: {
            responseType: 'arraybuffer'
        },success: function(data,textStatus,jqXHR) {
            var blob = new Blob([data],{type: jqXHR.getResponseHeader('content-type')});
            var fileName = jqXHR.getResponseHeader('content-disposition').split('filename=')[1].split(';')[0];
            saveAs(blob,fileName);
        },progress: function(e) {
            if (e.lengthComputable) {
                const completedPercentage = Math.round((e.loaded * 100) / e.total);
                if (completedPercentage >= 100) {
                    $("#loader").dialog("close");
                }
            }
            else {
                if (console) {
                    console.log('Content length not reported. Fix this server side.');    
                }
            }
        }
    });

Fetch API似乎是通过ajax拉取二进制文件的更好的方法,但是不支持IE,这对我来说是必需的。这是我查看的代码,以防它对任何人都有帮助。我没有添加关闭“加载程序”逻辑,但是我很确定您可以在保存文件之前或之后立即进行操作。

    fetch(url,{
        responseType: 'blob'
    }).then(response => response.blob())
      .then(blob => saveAs(blob,'test.xlsx'));

此答案是通过网络和一些SO帖子拼凑而成的。请参阅以下相关链接: