公開日: 2025 年 6 月 12 日
2025 年 5 月 20 日に、HTML 仕様が更新され、属性内の < と > がエスケープされるようになりました。これにより、ミューテーション XSS（mXSS）の脆弱性を防ぐことができます。この変更は Chrome 138 で導入され、2025 年 5 月 28 日にベータ版に昇格し、2025 年 6 月 24 日に安定版になります。
この投稿では、HTML 属性のエスケープ変更がウェブ デベロッパーに及ぼす影響と、発生する可能性のある破損について詳しく説明します。この変更の背後にあるセキュリティ上の理由については、Security Engineering ブログの関連投稿をご覧ください。
何が変更されたのですか？
属性 data-content の値が "<u>hello</u>" の <div> 要素があるとします。div.outerHTML を読み取るとどうなりますか？
従来は、次のような HTML が生成されていました。
<div data-content="<u>hello</u>"></div>
変更後、HTML は次のようになります。
<div data-content="<u>hello</u>"></div>
以前は、< も > も属性でエスケープされていませんでした。これらの文字はどちらも常にエスケープされます。
変更されない点
この変更は、シリアル化中に HTML フラグメントが文字列表現に変換される方法のみを変更します。影響は、innerHTML プロパティまたは outerHTML プロパティにアクセスする場合、または要素で getHTML() メソッドが呼び出される場合に限定されます。これらのオペレーションは、既存の DOM 構造を受け取り、テキスト形式の HTML 表現を生成します。
この変更は HTML 解析には影響しません。次の HTML について考えてみましょう。
<div id="div1" data-content="<u>hello</u>"></div>
<div id="div2" data-content="<u>hello</u>"></div>
どちらの div もまったく同じ方法で解析され、どちらの場合も div.dataset.content は "<u>hello</u>" を返します。
破損しないもの
getAttribute、getAttributeNS、dataset、attributes などの DOM API を使用して属性値を取得すると、以前と同じデコードされた値が返されます。特に、< と > はデコードされます。
次の例では、すべての console.log 行が "<u>" をログに記録します。
<div data-content="<u>"></div>
const div = document.querySelector("div");
// All of the following will log "<u>"
console.log(div.getAttribute("data-content"));
console.log(div.dataset.content);
console.log(div.attributes['data-content'].value);
何が破損する可能性があるか
innerHTML と outerHTML を使用して属性を取得する
innerHTML または outerHTML を使用して属性の値を抽出すると、コードが破損する可能性があります。少し複雑ですが、次の例について考えてみましょう。
<div data-content="<u>"></div>
const div = document.querySelector("div");
const content = div.outerHTML.match(/"([^"]+)"/)[1];
console.log(content);
この変更後、このコードの動作は異なります。以前は content は "<u>" と同じでしたが、現在は "<u>" です。
なお、正規表現による HTML の解析は推奨されません。属性の値を取得する必要がある場合は、前のセクションで説明した DOM API を使用します。
エンドツーエンド テスト
Chromium を使用して HTML を生成する CI/CD パイプラインがあり、HTML を静的な想定値と比較するテストを作成している場合、いずれかの属性に < または > が含まれていると、これらのテストが破損する可能性があります。
これは想定される破損です。すべての < 文字と > 文字がそれぞれ < と >, にエスケープされるように、想定される値を更新する必要があります。
概要
このブログ投稿では、HTML 仕様の変更について説明しました。この変更により、ブラウザは属性内の < と > のエスケープを開始し、一部のミューテーション XSS を防ぐことでセキュリティを強化します。
この変更は、2025 年 6 月 24 日に Chromium（バージョン 138）と Firefox（バージョン 140）のすべてのユーザーが利用できるようになります。また、2025 年 9 月頃にリリースされる Safari 26 ベータ版にも含まれています。
この変更によりウェブサイトが機能しなくなり、簡単に修正できないと思われる場合は、https://issues.chromium.org/ でバグを報告してください。