H5 移动端文件下载的方法

a 标签下载

// a标签下载文件，可跨域下载
    function aDownlad(url, fileName) {
    
    
        const link = document.createElement('a')
        link.href = url
        link.target = '_blank'
        link.download = fileName
        link.style.display = 'none'
        document.body.append(link)
        link.click()
    }

blob下载文件

// 通过blob下载文件
    function downloadByBlob(blob, fileName) {
    
    
        if (window.navigator.msSaveBlob) {
    
    //ie下载
            window.navigator.msSaveBlob(blob, fileName)
        } else {
    
    
            const URL = window.URL || window.webkitURL
            const url = URL.createObjectURL(blob)
            aDownlad(url, fileName)
        }
    }

XMLHttpRequest下载文件

跨域情况下，该方法失效

// 通过XMLHttpRequest下载文件
    function downloadFileByUrl(url, fileName) {
    
    
        const xhr = new XMLHttpRequest();
        xhr.open('GET', url, true);
        xhr.responseType = 'blob';
        xhr.onload = () => {
    
    
            if (xhr.status === 200) {
    
    
                // 获取blob数据并保存
                downloadByBlob(xhr.response, fileName);
            }
        };
        xhr.send();
    }