はじめに
こんにちは！！株式会社Inner Resourceの檜野です。
最近Xを見ているとGit何某で「CSSインジェクション」が出来ると話題になっていました。
※ Git何某は話題になって速攻で対処されていました
インジェクション攻撃の存在といくつかの手法は知っていますが、「CSSインジェクション」は初耳でした。
そこで、今回はその内容について調べてみたので、紹介します！
インジェクション攻撃とは？？
インジェクション攻撃とは、サーバーやデータベースに対して悪意のあるコードを注入することで、システムの脆弱性を利用して不正な動作を引き起こす攻撃手法の1つです。
最も一般的なインジェクション攻撃には、SQLインジェクションやクロスサイトスクリプティング（XSS）などがあります。
これらの攻撃は、ユーザー入力が適切に検証されない場合に発生しやすく、データの漏洩や改ざん、セッションハイジャックなどの深刻なセキュリティリスクを引き起こします。
CSSインジェクションとは？？
CSSインジェクションは、ユーザーが提供する入力を通じて悪意のあるCSSコードをウェブページに注入する攻撃手法です。
この手法を利用することで、攻撃者はページの外観を変更したり、ユーザーの操作を妨害したりすることができます。
例えば、攻撃者は特定の要素を隠す、クリックイベントを妨害する、あるいはユーザーインターフェースを誤誘導するなどの悪質な行為を行うことが可能です。
実際に試してみよう！！
それでは、実際に試して動作をみましょう！！
ステップ1
まずは、以下のような入力フォーム + 入力したものが出力される簡単なページを作成します。
ステップ2
入力フォームに以下を入力します
Hello 私はハッカーだ。君のPCを乗っ取った。情報を流されたく無ければ。⚪︎⚪︎⚪︎⚪︎に100万円振り込め。<style>body {background-color: red;}</style>
ステップ3
すると対策を講じていないサイトでは、CSSインジェクションにより背景が赤色になってしまいます。
自分以外が入力したものが、出力されるような掲示板等でこのような事が起きたら、ユーザーは本当にハックされたと誤認して、脅しに応じてしまうかもしれません…
コードはどのようになっているのか？？
devtoolsでソースコードを見てみると、ステップ2で入力したstyleが、そのままCSSと認識されてしまっているのが分かります。
防衛策
インジェクション攻撃は、ユーザーが入力したデータをしっかりと確認し、安全な形にサニタイズしたり、エスケープする事で防げます。
サニタイズ
悪意のある部分をJSを使ってバックエンドに送る前に取り除いたり、バックエンドでDBに保存する前に取り除いたりする事で防ぐ方法
エスケープ
特殊な文字（例えば、< や >）を安全なコードに置き換え、単なるテキストとして取り扱えるようにする事で防ぐ方法
まとめ
- 今回はHTMLを使って試しましたが、昨今HTMLのみでWEBサイトを作る事は少なく、Reactを使ったり、Ruby on Railsを使ったり、フレームワークを使う事がほとんどです。
- そういったフレームワークを使う際は、基本的な知識は要した状態で、各々どのような対策方法になるのかをしっかりと調べて、アプリの構築をしていく必要があります。
- ただ文字を出力するだけでなく、数式にしたり、コードブロックにしたり、様々な形で出力する際にも個別で対策が取られているかを意識する必要がありそうです。
- 実際にGit何某は数式出力機能が悪用出来たみたいです。
- 顧客が安心してアプリを使える環境にする為、見えないところでしっかりとセキュリティレベルを高めていきましょう！！
株式会社Inner Resource のエンジニアブログです。 忙しい研究者・研究施設の業務効率化のためのクラウド購買管理ソフト「リプルア」を開発しています。
Discussion