為什么要做這個東西

最近做一個需求，前端請求一個接口，后臺生成文件以后返回文件名，前端再通過window.open下載這個文件。發現window.open有時生效有時不生效，后來查閱資料后發現瀏覽器出安全方面的考量，會把用戶操作完頁面后一段時間內的window.open視為非法操作屏蔽掉，這個時間后來經過測試大概是五秒；如果接口請求比較耗時就會導致open被屏蔽。這里封裝一個函數，用戶操作完頁面4.5秒后請求沒有完成時先執行window.open，接口請求完成后替換新窗口的url完成文件下載。如果在4.5秒內請求完成了就直接執行window.open

代碼

function asyncOpenWindow(promise) {let newWindow = null;const timeOut = setTimeout(() => {try {if (navigator.userAgent.indexOf('Chrome') > -1) {newWindow = window.open('', '', 'width=500,height=100,location=no,menubar=no');}} catch (e) {console.log(e);}}, 4500);promise.then((url) => {clearTimeout(timeOut);if (newWindow) {newWindow.location.href = url;} else {window.open(url);}}); }

使用

const fn =asncy function(){ const url =await requset return url } asyncOpenWindow(fn())

總結

以上是生活随笔為你收集整理的window.open无法打开新窗口的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。