handle中存在異步操作，window.open被瀏覽器阻止的問題

iliyaku 發布于2019-08-21 15:17 / 1975人閱讀

摘要：想要不被瀏覽器阻止，需要在事件的處理函數的作用域中調用打開新窗口，比如在用戶的時候。一是直接把綁定為函數，大體這樣這樣做忽略了函數內部已經不屬于的作用域，所以不可行，依然會被瀏覽器阻止。

想要window.open不被瀏覽器阻止，需要在事件的處理函數的作用域中調用window.open打開新窗口，比如在用戶click的時候。

xxx.onClick = ()=>{
    window.open("/");
}

但是當處理函數(handle)中涉及到異步操作的時候, 我產生了兩種錯誤的解決想法。一是直接把handle綁定為async函數，大體這樣

xxx.onClick = async()=>{
    let url = await oneAsyncOperation;
    window.open(url);
}

這樣做忽略了async函數內部已經不屬于handle的作用域，所以不可行，依然會被瀏覽器阻止。意識到這點之后，隨手就改，大體這樣：

let handleGenerator = async()=>{
    let url = await oneAsyncOperation;
    return ()=>{
        window.open(url);    
    }
}
xxx.onClick = handleGenerator();

期望的是通過一個async高階函數，在函數體內進行異步操作，然后返回一個普通函數作為handle。
馬上就發現自己又想錯了，async函數的返回體是Promise，不是Function，因此并不能作為handle。

最后只能放棄使用async函數，換用另一個方案來打開窗口:

xxx.onClick = ()=>{
    let win = window.open("/"); //在handle的作用域內,先打開一個window
    oneAsyncOperation().then((url)=>{
        win.location.href = url; //然后在異步操作的回調中對前面創建的新window重新設置屬性
    })
}

ps: 上面先創建的window, 一般先打開一個loading頁面的地址。

GPU云服務器云服務器 window open 云計算存在的問題互聯網醫療存在的問題此網站的安全證書存在問題

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/88143.html

作為window對象屬性的元素多窗口和窗體

摘要：作為對象屬性的文檔元素如果文檔中用屬性為元素命名。其就是交互窗口中的每個窗口窗體都是的執行上下文。以對象作為全局對象，這樣的話，一個窗口窗體中的代碼可以應用到其他窗口或者窗體并且同源策略沒有進行阻止。作為window對象屬性的文檔元素如果html文檔中用id屬性為元素命名。并且如果 window對象沒有此名字的屬性，則window對象會賦予一個屬性，其名字為id屬性的值，其值指向該...

fredshare 2019-08-23 10:41 評論0 收藏0
window.open被瀏覽器攔截的解決方案

摘要：原因分析深入研究當瀏覽器檢測到非用戶操作產生的新彈出窗口，則會對其進行阻止。但是，被瀏覽器攔截我們代碼中要彈出的窗口并不是程序員所希望的。現象最近在做項目的時候碰到了使用window.open被瀏覽器攔截的情況，搞得人無比郁悶啊，雖然在自己的環境可以對頁面進行放行，但是對用戶來說，不能要求用戶都來通過攔截。何況當出現攔截時，很多小白根本不知道發生了啥，不知道在哪里看被攔截的頁面，簡...

rickchen 2019-08-02 15:33 評論0 收藏0
JavaScript BOM——“window 對象”的注意要點

摘要：僅限數值表示新窗口的高度。一個字符串參數，并將其顯示給用戶，提供兩個按鈕，一個按鈕返回布爾值另一個按鈕返回布爾值。全局作用域 window 在是BOM 的核心對象，他是瀏覽器的一個實例。在全局作用域中聲明的變量、函數都會變成window 對象的屬性和方法。如： var age = 18; function sayAge(){ console.log(window.age);...

levius 2019-08-19 17:08 評論0 收藏0
web安全一，同源策略與跨域

摘要：可以說同源策略在安全中扮演著及其重要的角色。我把這個領域的東西寫成了一個系列，以后還會繼續完善下去安全一同源策略與跨域安全二攻擊安全三攻擊之所以要將同源策略與跨域寫在一起，是因為存在瀏覽器的同源策略，才會存在跨域問題何為同源策略同源策略是瀏覽器實現的一種安全策略，它限制了不同源之間的文檔和腳本交互的權限。只有同一個源的腳本才會具有操作dom、讀寫cookie、session 、a...

cgspine 2019-08-22 14:56 評論0 收藏0
js基礎知識筆記

摘要：常見內存泄漏情形全局變量被忘記的或者閉包引用閉包概念有權訪問另一個函數作用域的變量的函數。會話存儲刷新頁面依舊存在，與在持久上不同外，其余一致。請求向指定的資源提交被處理的數據，數據量和類型沒限制，不主動緩存，頁面刷新數據會被重新提交。 defer 腳本延遲執行，適用于外部腳本文件async 立即下載，不保證順序（建議不修改DOM，避免重繪） CDN加速 (Content De...

李文鵬 2019-08-23 12:13 評論0 收藏0