blob 下载并给文件重命名 es6的写法 jquery的写法

1、es6的写法
/**
 * 获取 blob
 * @param  {String} url 目标文件地址
 * @return {Promise} 
 */
function getBlob(url) {
    return new Promise(resolve => {
        const xhr = new XMLHttpRequest();

        xhr.open('GET', url, true);
        xhr.responseType = 'blob';
        xhr.onload = () => {
            if (xhr.status === 200) {
                resolve(xhr.response);
            }
        };

        xhr.send();
    });
}

/**
 * 保存
 * @param  {Blob} blob     
 * @param  {String} filename 想要保存的文件名称
 */
function saveAs(blob, filename) {
    if (window.navigator.msSaveOrOpenBlob) {
        navigator.msSaveBlob(blob, filename);
    } else {
        const link = document.createElement('a');
        const body = document.querySelector('body');

        link.href = window.URL.createObjectURL(blob);
        link.download = filename;

        // fix Firefox
        link.style.display = 'none';
        body.appendChild(link);
        
        link.click();
        body.removeChild(link);

        window.URL.revokeObjectURL(link.href);
    }
}

/**
 * 下载
 * @param  {String} url 目标文件地址
 * @param  {String} filename 想要保存的文件名称
 */
function download(url, filename) {
    getBlob(url).then(blob => {
        saveAs(blob, filename);
    });
}

转自 ：https://www.jianshu.com/p/6545015017c4


2、jquery的写法
<script src="https://code.jquery.com/jquery-3.5.0.js">script>

var dfd = $.Deferred();
var down_url = ''
$(".annex_info").click(function (){
    var url= $(this).attr("data-url"); //下载的链接
    var name= $(this).attr("data-name"); // 下载的文件名
    down_url = url
    download(url,name)
})
var wait = function(dfd){
    var tasks = function(){
        const xhr = new XMLHttpRequest();
        xhr.open('GET', down_url, true);
        xhr.responseType = 'blob';
        xhr.onload = () => {
            if (xhr.status == 200) {
                dfd.resolve(xhr.response); // 改变Deferred对象的执行状态
            }
        };
        xhr.send();

    };
    setTimeout(tasks,0);
    return dfd.promise(); // 返回promise对象
};


/**
 * 下载
 * @param  {String} url 目标文件地址
 * @param  {String} filename 想要保存的文件名称
 */
function download(url, filename) {
    var d = wait(dfd)
    $.when(d).done(function (blob){
        console.log('终于结束了',blob)
        saveAs(blob, filename);
    })
}
/**
 * 保存
 * @param  {Blob} blob
 * @param  {String} filename 想要保存的文件名称
 */
function saveAs(blob, filename) {
    if (window.navigator.msSaveOrOpenBlob) {
        navigator.msSaveBlob(blob, filename);
    } else {
        const link = document.createElement('a');
        const body = document.querySelector('body');

        link.href = window.URL.createObjectURL(blob);
        link.download = filename;

        // fix Firefox
        link.style.display = 'none';
        body.appendChild(link);

        link.click();
        body.removeChild(link);

        window.URL.revokeObjectURL(link.href);
    }
}