見出し画像

[W3C] Truested Typesについて

り

W3CのWeb Application Security WG が公開している、「Truested Types」というWorking Draftの大事なところを日本語でまとめていきます。英語の原文は以下です。

はじめに

ウェブアプリケーション上でユーザーからの入力を元に何かしらの操作をするのは脆弱性の元になります。Trusted TypesはDOMベースのクロスサイトスクリプティング(DOM XSS)のリスクを下げるための機能になります。

ポリシー

Trusted Typesオブジェクトはユーザーが定義したイミュータブルなポリシー関数によって作ることができます。例えば以下は&, <, >, ", 'をエスケープするポリシー関数になります。このescapePolicy関数でTrusted Typesオブジェクトを作ることができます。

const escapePolicy = trustedTypes.createPolicy('escape-policy', {
    createHTML: (unsafeValue) => {
      return unsafeValue
      .replace(/&/g, "&amp;")
      .replace(/</g, "&lt;")
      .replace(/>/g, "&gt;")
      .replace(/"/g, "&quot;")
      .replace(/'/g, "&#039;");
    }
});

Content Security Policy

コンテンツセキュリティーポリシーで指定することによって、アプリケーション内でTrusted Typesを使うことを強制することができます。以下の記述では、one, twoというポリシーを強制するような記述になります

Content-Security-Policy: require-trusted-types-for 'script'; trusted-types one two

デモ

これまでの内容をまとめたデモです。

19行目で追加しているHTMLのコードはescapePolicyを通してHTMLとして解釈されていないことを確認できます。

上記のHTMLの出力結果