クロスサイト スクリプティング (XSS) 攻撃は、Web アプリケーションの一般的な脆弱性であり、最も危険なタイプの 1 つは DOM ベースの XSS です。この形式の XSS は、Web ページのドキュメント オブジェクト モデル (DOM) が操作されて悪意のあるスクリプトが実行されるときに発生します。このブログでは、DOM ベースの XSS とその仕組み、そして実際のサンプル コードを使用してアプリケーションをこれらの攻撃から保護する方法について説明します。

DOM ベース XSS とは何ですか?

DOM ベースの XSS は、サーバー側のコードではなくクライアント側のコードに脆弱性がある XSS 攻撃の一種です。これは、Web アプリケーションがユーザー入力などの信頼できないソースからのデータを使用し、適切な検証やエスケープを行わずにそのデータを DOM に書き込む場合に発生します。これにより、Web ページのコンテキスト内で悪意のあるスクリプトが実行され、攻撃者がデータを盗んだり、セッションをハイジャックしたりできるようになります。

DOM ベースの XSS の仕組み

攻撃者が DOM ベースの XSS を悪用する方法を理解するために、簡単なシナリオを分析してみましょう:

脆弱な Web アプリケーションの例
URL ハッシュからのユーザー入力を使用して挨拶メッセージを表示する単純な Web ページを考えてみましょう。

攻撃者が脆弱性を悪用する方法

1.悪意のある URL の作成: 攻撃者は、URL ハッシュに悪意のある JavaScript コードを含む URL を作成できます。例えば：

https://xyz.com/#

2.悪意のある URL の共有: 攻撃者はこの URL を潜在的な被害者と共有し、被害者は何の疑いもなくクリックする可能性があります。攻撃者は、電子メール、ソーシャル メディア、またはその他の手段を介してこのリンクを配布する可能性があります。

3.脆弱性の悪用: 被害者が悪意のある URL にアクセスすると、Web アプリケーションは URL ハッシュから値を抽出し、DOM に挿入します。悪意のあるスクリプトは Web ページのコンテキストで実行されます。

結果: 被害者には、スクリプトが実行されたことを示すメッセージ「XSS」を含むアラート ボックスが表示されます。実際の攻撃では、悪意のあるスクリプトが Cookie の盗用、キーストロークのキャプチャ、ユーザーのフィッシング サイトへのリダイレクトなどのアクションを実行する可能性があります。

    var userInput = window.location.hash.substring(1);
    document.getElementById('message').innerHTML = "Hello, "   userInput   "!";
    // This results in: Hello, !
    // The alert will pop up

DOM ベースの XSS の防止

DOM ベースの XSS から保護するには、次のベスト プラクティスに従ってください:

1.ユーザー入力のサニタイズとエスケープ: ユーザー入力を DOM に挿入する前に、必ずユーザー入力をサニタイズしてエスケープします。 DOMPurify などのライブラリを使用して HTML をサニタイズします。

2.安全な DOM 操作メソッドを使用する: innerHTML を使用する代わりに、textContent や createElement および appendChild などのより安全なメソッドを使用します。

3.コンテンツ セキュリティ ポリシー (CSP): 強力な CSP を実装して、スクリプトをロードして実行できるソースを制限します。

DOM ベースの XSS は、Web アプリケーションやユーザー データを侵害する可能性がある重大なセキュリティ リスクです。ユーザー入力のサニタイズやエスケープ、安全な DOM 操作方法の使用、堅牢なコンテンツ セキュリティ ポリシーの実装などのベスト プラクティスに従うことで、DOM ベースの XSS 攻撃のリスクを大幅に軽減できます。

常に警戒を怠らず、JavaScript アプリケーションがこれらの脆弱性やその他の脆弱性から安全であることを確認してください。ご質問がある場合、またはさらにサポートが必要な場合は、以下のコメント欄にお気軽にお問い合わせください。