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"” 的相關文章

mark元素使用紅色代表及例子

mark元素使用紅色代表及例子

在 HTML 中,<mark> 元素用於標記或突出顯示文本中的重要或關鍵內容。為了提高用戶瀏覽體驗,這些文本內容通常被渲染成鮮艷的紅色,因為紅色是視覺上最吸引人的顏色之一。 舉個例子,在一篇文章中,我們可能會用 <mark> 標記來標記一段關鍵文字,如下所示:<p>這篇文章將會介紹如何使用 <mark>CSS</mark> 實現代碼高亮顯示。</p >在這個例子中,我們使用 <mark> 標記來突出顯示關鍵詞 "CSS",這使得讀者可以更容易地識別出本文的主題和關鍵內容。…

一個簡單的 HTML5 導航菜單的示例代碼

一個簡單的 HTML5 導航菜單的示例代碼

以下是一個簡單的 HTML5 導航菜單的示例代碼,這個導航菜單使用了 HTML5 中的 `nav` 標簽來包裝整個菜單,使用了 Flex 布局來對菜單進行布局和對齊,同時也設置了一些簡單的樣式來美化菜單。…

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

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

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

html制作網頁教程技能及代碼例子

html制作網頁教程技能及代碼例子

而HTML作為網頁的標準語言,學習HTML制作網頁的基本技能則是入門網頁制作的必修課程。在這篇文章中,我們將為大家講解一份詳細的HTML制作網頁教程,幫助初學者快速掌握網頁制作技巧,實現自己的網站夢想。以下是一個基礎的HTML網頁制作教程,步驟如下:1. 創建網頁文件 首先,打開一個文本編輯器,如Windows中的記事本,macOS中的TextEdit等。然後,在編輯器中創建一個新文件,將文件後綴名改為.html,表示這是一個HTML網頁文件。2. 添加HTML基礎結構。3. 添加網頁內容。4. 保存文件並打開網頁。…

html3d地球代碼示例代碼

html3d地球代碼示例代碼

以下是一個使用 HTML、CSS 和 JavaScript 實現 3D 地球的示例代碼。該代碼使用了 HTML、CSS 和 JavaScript 語言來實現。其中的元素和語法如下:perspective: 設置元素的透視視圖。總之,使用 HTML、CSS 和 JavaScript 實現 3D 地球,用到的主要技術是透視、變換、偽元素和事件監聽等。通過這些技術的靈活組合,可以呈現出逼真的 3D 地球效果,提供更豐富的交互和用戶體驗。…