Newly available 主要ブラウザで対応済みだが、古いバージョンでは未対応の場合がある。

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
83
83
148
26
83
26
innerHTML (enforces trusted types)

信頼された型が強制される場合は `TrustedHTML` インスタンスが必要。

83
83
148
26
83
26
innerText (enforces trusted types)

TrustedScriptインスタンスが必要。

83
83
148
26
83
26
src (enforces trusted types)

信頼された型が強制される場合は `TrustedScriptURL` インスタンスが必要です。

83
83
148
26
83
26
text (enforces trusted types)

信頼された型が強制される場合は `TrustedScript` インスタンスが必要である。

83
83
148
26
83
26
textContent (enforces trusted types)

信頼された型が強制される場合は `TrustedScript` インスタンスが必要である。

83
83
148
26
83
26
code_param_enforces_trusted_types

code` パラメータは、信頼された型が強制される場合には `TrustedScript` インスタンスを必要とする。

83
83
148
26
83
26
code_param_enforces_trusted_types

code` パラメータは、信頼された型が強制される場合には `TrustedScript` インスタンスを必要とする。

83
83
148
26
83
26
innerHTML (enforces trusted types)

信頼された型が強制される場合は `TrustedHTML` インスタンスが必要。

83
83
148
26
83
26

TrustedHTML はTrusted Types API のインターフェイスで、開発者が注入先に挿入して HTML としてレンダリングできる文字列を表します。これらのオブジェクトは TrustedTypePolicy.createHTML() によって作成されるため、コンストラクターはありません。

83
83
148
26
83
26

toJSON() は TrustedHTML インターフェイスのメソッドで、格納されているデータの JSON 表現を返します。

90
90
148
26
90
26

toString() は TrustedHTML インターフェイスのメソッドで、注入先へ安全に挿入できる文字列を返します。

83
83
148
26
83
26

TrustedScript はTrusted Types API のインターフェイスで、開発者がスクリプトを実行する可能性のある注入先に挿入できる、コンパイルされていないスクリプト本体を持つ文字列を表します。これらのオブジェクトは TrustedTypePolicy.createScript によって作成されるため、コンストラクターはありません。

83
83
148
26
83
26

toJSON() は TrustedScript インターフェイスのメソッドで、格納されているデータの JSON 表現を返します。

90
90
148
26
90
26

toString() は TrustedScript インターフェイスのメソッドで、注入先へ安全に挿入できる文字列を返します。

83
83
148
26
83
26

TrustedScript はTrusted Types API のインターフェイスで、開発者がスクリプトを実行する可能性のある注入先に挿入できる、外部スクリプトの URL として解釈できる文字列を表します。これらのオブジェクトは TrustedTypePolicy.createScriptURL によって作成されるため、コンストラクターはありません。

83
83
148
26
83
26

toJSON() は TrustedScriptURL インターフェイスのメソッドで、格納されているデータの JSON 表現を返します。

90
90
148
26
90
26

toString() は TrustedScriptURL インターフェイスのメソッドで、注入先へ安全に挿入できる文字列を返します。

83
83
148
26
83
26

TrustedTypePolicy はTrusted Types API のインターフェイスで、TrustedType オブジェクトを作成する一連の関数を定義します。

83
83
148
26
83
26

createHTML() methodは TrustedTypePolicy インターフェイスのメソッドで、 TrustedHTML オブジェクトを TrustedTypePolicyFactory.createPolicy() で作成されたポリシーを使用して作成します。

83
83
148
26
83
26

createScript() methodは TrustedTypePolicy インターフェイスのメソッドで、 TrustedScript オブジェクトを TrustedTypePolicyFactory.createPolicy() で作成されたポリシーを使用して作成します。

83
83
148
26
83
26

createScriptURL() methodは TrustedTypePolicy インターフェイスのメソッドで、 TrustedScriptURL オブジェクトを TrustedTypePolicyFactory.createPolicy() で作成されたポリシーを使用して作成します。

83
83
148
26
83
26

name は TrustedTypePolicy インターフェイスの読み取り専用プロパティで、このポリシーの名前を返します。

83
83
148
26
83
26

TrustedTypePolicyFactory はTrusted Types API のインターフェイスで、ポリシーを作成し、作成されたポリシーに対して信頼型オブジェクトの検証ができるようにします。

83
83
148
26
83
26

createPolicy() は TrustedTypePolicyFactory インターフェイスのメソッドで、 policyOptions として渡されたルールを実装した TrustedTypePolicy オブジェクトを作成します。

83
83
148
26
83
26

defaultPolicy は TrustedTypePolicyFactory インターフェイスの読み取り専用プロパティで、既定の TrustedTypePolicy または空であれば null を返します。

83
83
148
26
83
26

emptyHTML は TrustedTypePolicyFactory インターフェイスの読み取り専用プロパティで、空文字列の入った TrustedHTML オブジェクトを返します。

83
83
148
26
83
26

emptyScript は TrustedTypePolicyFactory インターフェイスの読み取り専用プロパティで、空文字列の入った TrustedScript オブジェクトを返します。

83
83
148
26
83
26

getAttributeType() は TrustedTypePolicyFactory インターフェイスのメソッドで、ウェブ開発者が要素に対して信頼型が要求されるか、場合に必要な場合にどの信頼型を使用するかを調べることができます。

83
83
148
26
83
26

getPropertyType() は TrustedTypePolicyFactory インターフェイスのメソッドで、要素のプロパティに対して信頼型が要求されるかどうかをウェブ開発者が調べることができるようにします。

83
83
148
26
83
26

isHTML() は TrustedTypePolicyFactory インターフェイスのメソッドで、渡されたものが有効な TrustedHTML オブジェクトであった場合は true を返します。

83
83
148
26
83
26

isScript() は TrustedTypePolicyFactory インターフェイスのメソッドで、渡されたものが有効な TrustedScript オブジェクトであった場合は true を返します。

83
83
148
26
83
26

isScriptURL() は TrustedTypePolicyFactory インターフェイスのメソッドで、渡されたものが有効な TrustedScriptURL オブジェクトであった場合は true を返します。

83
83
148
26
83
26
その他

HTTP の Content-Security-Policy (CSP) における require-trusted-types-for ディレクティブは、 Element.innerHTML セッターのような DOM XSS シンク関数に渡されるデータを制御するように、ユーザーエージェントに指示します。

83
83
148
26
83
26

HTTP の Content-Security-Policy (CSP) における trusted-types ディレクティブは、既知の DOM XSS シンクの使用を、文字列の代わりにスプーフィング不可能な型付きの値のみを受け入れる定義済みの関数のセットに制限するようにユーザエージェントに指示します。

83
83
148
26
83
26
1+対応 (バージョン) 未対応 注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

JAVASCRIPT
<meta http-equiv="Content-Security-Policy"
  content="require-trusted-types-for 'script'">
<script>
const policy = trustedTypes.createPolicy('default', {
  createHTML: (input) => DOMPurify.sanitize(input)
});
el.innerHTML = policy.createHTML(userInput);
</script>

実務での使いどころ

  • Trusted types の活用

    trustedTypes は Window インターフェイスの読み取り専用プロパティで、このグローバルオブジェクトに関連付けられた TrustedTypePolicyFactory オブジェクトを返し、信頼型 API を使用するためのエントリーポイントを提供します。

注意点

  • 古いブラウザでは対応していない場合がある。

アクセシビリティ

  • スクリーンリーダーでの読み上げを確認すること。