a标签download属性失效,跨域下载如何重命名文件

子成君 108 0

[aru_42]  众所周知  下载文件不是在子集的服务器或域名中,谷歌和火狐浏览器a标签download属性修改文件名是失效的(其他浏览器直接不支持)

目前能够想到的办法就是先把文件下载为blob原始文件数据类型(此时存储于缓存中),再重命名下载到客户端,这就解决了跨域下载a标签download属性失效的问题

注意: 此方法只适用于小文件,对于大文件来说耗时太久!!

代码转自: https://www.cnblogs.com/goloving/p/8483969.html

// 下载
// @param  {String} url 目标文件地址
// @param  {String} filename 想要保存的文件名称
function courseDownload(url, filename) {
    getBlob(url, function(blob) {
        saveAs(blob, filename);
    })
}
function getBlob(url,cb) {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);
    xhr.responseType = 'blob';
    xhr.onload = function() {
        if (xhr.status === 200) {
            cb(xhr.response);
        }
    };
    xhr.send();
}
// 保存
// @param  {Blob} blob
// @param  {String} filename 想要保存的文件名称
function saveAs(blob, filename) {
    if (window.navigator.msSaveOrOpenBlob) {
        navigator.msSaveBlob(blob, filename);
    } else {
        var link = document.createElement('a');
        var 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);
    }}

 

发表评论 取消回复
OwO 图片 链接 代码

分享