noopener與noreferrer

noopener與noreferrer

寫網頁的時候,遇到需要開新視窗的連結,都會使用 target="_blank",殊不知這個簡單的動作竟是有安全疑慮的,黑心的網站可能會透過開新視窗的同時偷偷動手腳。

具體來說就是,當網頁點了網頁的某連結,開了新視窗瀏覽,而原本的那個視窗可能會被偷偷轉跳到其它網站,如果是跳到一個需要輸入帳號密碼的頁面,使用者所輸入的內容即會被紀錄下來。

為了避免這個狀況,在網頁使用到開新視窗語法時,務必要加上 rel="noopener noreferrer"。 也因為此原因,google已開始將未加上noopener的開新視連結,視為危險的連結,連帶可能影響到網站SEO。

如果只寫noopener也是可以,但據說firefox不支援,所以noopener和noreferrer都寫是比較完整的作法。

<a href="https://iamedge.biz" target="_blank" rel="noopener noreferrer">艾吉單飛鳥</a>

請網頁設計師們務必記下這兩個字,因為會很常用到,又是長得很奇怪的字,所以我紀錄在這裡加強記憶




 迴響列表

edge Avatar
edge - 2年前
在 vscode 裡面直接用 a:blank 就好了


 留言表單

如果想要使用回覆功能,或是刪除修改自己的留言,可以登入網站後再來留言。

🧨 Method Illuminate\View\View::__toString() must not throw an exception, caught ParseError: syntax error, unexpected 'array' (T_ARRAY), expecting function (T_FUNCTION) or const (T_CONST)