rel="noopener noreferrer"

`rel="noopener noreferrer"` 是HTML中的一個屬性設置,用於增加鏈接的安全性。當你在一個網頁中創建一個指向另一個網頁的鏈接時,這個屬性可以幫助防止某些潛在的安全風險。

rel="noopener"

rel="noopener noreferrer"

`noopener` 是一個用於防止新打開的窗口或標簽頁通過 `window.opener` 屬性訪問到原始頁面(即包含鏈接的頁面)的JavaScript對象的屬性。如果不設置這個屬性,那麽新打開的頁面可能會使用 `window.opener` 來讀取或修改原始頁面的內容,這可能會導致一些安全問題,如跨站腳本攻擊(XSS)。

rel="noreferrer"

`noreferrer` 是一個用於防止瀏覽器發送 HTTP Referer 頭部的屬性。Referer 頭部通常包含了用戶是從哪個頁面跳轉到當前頁面的信息。在某些情況下,這可能會泄露用戶的隱私或敏感信息。通過設置 `noreferrer`,你可以確保瀏覽器不會發送這個頭部,從而增加用戶隱私的保護。

結合使用

通常,為了增加安全性,建議將 `noopener` 和 `noreferrer` 一起使用,即 `rel="noopener noreferrer"`。這樣可以同時防止通過 `window.opener` 的訪問和防止發送 Referer 頭部。

示例

下面是一個使用 `rel="noopener noreferrer"` 的HTML鏈接示例:

<a href="https://example.com" target="_blank" rel="noopener noreferrer">點擊訪問</a>

在這個示例中,當用戶點擊鏈接時,會在一個新的瀏覽器窗口或標簽頁中打開 `https://example.com`,並且由於設置了 `rel="noopener noreferrer"`,這個新頁面將不能通過 `window.opener` 訪問原始頁面,同時瀏覽器也不會發送 Referer 頭部。

分享給朋友:

“rel="noopener noreferrer"” 的相關文章

html a標簽target屬性

html a標簽target屬性

HTML語言中的標簽用於定義超鏈接。其中,標簽有一個屬性叫做target,它用於指定鏈接在何處打開。目前,標簽的target屬性有以下四個取值:- _self:鏈接會在當前窗口中打開(默認值),這意味著打開新的文檔或資源時,頁面會在當前瀏覽器窗口中重新加載,並將新文檔或資源顯示在當前窗口中。基於以上…

HTML 和 CSS 實現網頁導航欄和下拉菜單

HTML 和 CSS 實現網頁導航欄和下拉菜單

以下是一組基於 HTML 和 CSS 實現網頁導航欄和下拉菜單的完整代碼:HTML 代碼:CSS 代碼。該代碼實現了一個簡單的網頁導航欄和下拉菜單,其中 `nav` 表示導航欄,`ul` 表示菜單,`li` 表示菜單項,`a` 表示鏈接。通過設置 CSS 樣式,將菜單項設置為了懸停時出現下拉菜單,同…

javascript怎麼改變字體顏色文本顏色代碼

javascript怎麼改變字體顏色文本顏色代碼

這裏是一個簡單的 JavaScript改變文體顏色代碼示例,它會在頁面上創建一個按鈕,點擊該按鈕會使文本顏色發生變化。這段代碼首先在頁面中創建了一個按鈕,然後獲取該按鈕和一個段落元素的引用,接著為按鈕添加了一個事件監聽器,當按鈕被點擊時,段落文本顏色將變成紅色。…

一個簡單的html放煙花特效的代碼

一個簡單的html放煙花特效的代碼

以下是一個簡單的html放煙花特效的代碼,代碼說明:1. 使用html和css定義了一個煙花的基本樣式;2. 使用javascript動態生成多個煙花元素,並使用animation讓其展開,模擬煙花爆炸效果;3. 使用setTimeout函數控制煙花爆炸持續時間,並使用setInterval控制煙花…

一個簡單的html結婚特效的代碼

一個簡單的html結婚特效的代碼

以下是一個簡單的html結婚特效的代碼:1. 使用html和css定義了一個結婚的基本樣式;2. 分別定義新娘和新郎,並使用background-image設置其背景圖;3. 定義一個心形圖案,並使用animation讓其跳動。…

一個簡單的html大海日出特效的代碼

一個簡單的html大海日出特效的代碼

以下是一個簡單的html大海日出特效的代碼:1. 使用html和css定義了一個大海和太陽的基本樣式;2. 使用animation讓太陽從初始位置向上升起,並且設置好其動畫屬性;3. 設置大海背景漸變和水面的動畫效果。…