【Solve】hyper link 顯示 about:blank#blocked 的問題

超連結開啟新分頁有多種寫法，原本是直接在 href 裡帶 Url 路徑

<a href="../BookStore.aspx" target="_blank">Book Store</a>

因為後來需要在連到新頁面之前做其他事情，因此我將它改為 function

<a href="javascript:LinkToBookStore()">Book Store</a>

function LinkToBookStore()
{
    //do more thing
    let myWindow = window.open("../BookStore", "_blank");
    myWindow.focus();
}

在 local 測試結果是符合預期的，但是上到測試環境就出現空白頁面，網址顯示 about:blank#blocked 的問題。

查了一下發現當瀏覽器偵測到安全問題阻擋頁面開啟時，就會顯示的頁面。
後來將 href 改為 onclick 就能正常開啟畫面了。

<a onclick="LinkToBookStore()">Book Store</a>

---

雖然問題已解，但仍然有些困惑，看起來是 target=”_blank” 有安全性的問題，因為新開啟的分頁可以操作 parent 頁面的各種資訊，包含 function，因此被判定為是有安全疑慮的用法，若要使用的話會建議在 html 設定 rel=”noopener noreferrer” 或在 javascript 加上 window.opener = null;

以下是目前還有疑惑的部分：

1. 為什麼用 onclick 跟直接在 html href=Url 實測上沒有跳出空白頁面？他們也都有做 target=”_blank” 的設定阿
2. 如果是安全性問題被擋，那我加上了 rel=”noopener noreferrer” 或 window.opener = null; 應該要可以顯示正常，但實測依然是空白頁面