最近在做非同步導出的功能,導出的過程中前端另外啟動一個查詢導出進度的線程介面。如果導出完成後,把生成的文件上傳到伺服器,返回給前端一個文件的下載地址;前端自動打開這個地址進行跳轉下載。 有兩種方式 1.直接使用js自帶的方式打開鏈接 這種方式有一個問題,會被瀏覽器自動攔截彈出的視窗:”已阻止彈出視窗“ ...
最近在做非同步導出的功能,導出的過程中前端另外啟動一個查詢導出進度的線程介面。如果導出完成後,把生成的文件上傳到伺服器,返回給前端一個文件的下載地址;前端自動打開這個地址進行跳轉下載。
有兩種方式
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);