vue 前端自動打開文件地址進行下載

　　最近在做異步導出的功能，導出的過程中前端另外啓動一個查詢導出進度的線程接口。如果導出完成後，把生成的文件上傳到服務器，返回給前端一個文件的下載地址；前端自動打開這個地址進行跳轉下載。

有兩種方式

1.直接使用js自帶的方式打開鏈接

　　這種方式有一個問題，會被瀏覽器自動攔截彈出的窗口：”已阻止彈出窗口“，導致用戶下載文件失敗，會認爲程序報錯。可以用方案2

window.open(url)

 

2.用代碼創建一個隱藏的a標籤

　　用代碼創建一個隱藏的a標籤，把下載地址賦值給a標籤的href屬性，然後用js模擬鼠標點擊進行下載文件。

            const link = document.createElement('a');
            link.href = url;
            link.download = 'file.xls';
            link.style.display = 'none';
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);