前端實現附件下載功能

方法一(如果是瀏覽器可識別的文件，可能會被直接打開)

//下載文件
function downLoadFile(fileUrl, fileName) {
    const link = document.createElement('a');
    link.href = fileUrl;
    link.download = fileName; //下載的文件名
    link.click();
},
// downLoadFile('name.txt','文件名');

方法二（通過請求的方式下載文件）

// 保存到本地並自動點擊
function saveAs(data, name) {
    var urlObject = window.URL || window.webkitURL || window;
    var export_blob = new Blob([data]);
    var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
    save_link.href = urlObject.createObjectURL(export_blob);
    save_link.download = name;
    save_link.click();
}
// 下載含有url的文件
function downloadUrlFile(url, fileName) {
    var url2 = url.replace(/\\/g, '/');
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url2, true);
    xhr.responseType = 'blob';
    //xhr.setRequestHeader('Authorization', 'Basic a2VybWl0Omtlcm1pdA==');
    // 為了避免大文件影響用戶體驗，建議加loading
    xhr.onload = function(){
        if (xhr.status === 200) {
            // 獲取文件blob數據並保存
            saveAs(xhr.response, fileName);
        }else {
            Alert('下載文件失敗！')
        }
    };
    xhr.send();
}

downloadUrlFile(fileUrl, fileName);

方法三（使用H5 + plus 瀏覽器會報錯，app則不會，親測Hbuilder打包有效）

//提前加載plus對象
document.addEventListener('plusready',function () {},false);

var dtask = plus.downloader.createDownload(fileUrl, {}, function(d, status){
    // 下載完成
    if(status == 200){ 
        var showSize;
        var kb = Math.round(d.downloadedSize/128);
        showSize = kb + 'kb';
        if(kb > 1024){
            showSize = (kb/1024).toFixed(2) + 'M'
        }
        Alert(d.filename +'</br>'+ '大小: '+showSize ,function(){},'下載成功')
    } else {
        Alert(status + ', 文件下載失敗',function(){},'下載失敗')
    }  
 });
 //dtask.addEventListener("statechanged", onStateChanged, false);
 dtask.start();

下載的文件地址：設備存儲>android>data>plus.+appID(app編號)>downloads