【入門編】SVG画像ファイルに埋め込まれたスクリプトによるXSS – アプリケーションセキュリティ & 安全な開発防御ガイド

「画像ファイルなら大丈夫だろう」と油断していませんか？

実はそのSVGファイル、あなたのWebサイトを乗っ取ろうとする「トロイの木馬」かもしれません。こんにちは。セキュリティの現場で長年、泥臭い攻防を繰り広げてきた者です。

今日は、開発現場でつい見落とされがちな「SVGファイル経由のXSS（クロスサイトスクリプティング）」という、少し恐ろしいけれど面白いテーマについて、身近な例えを交えてお話ししますね。

—

普通、JPEGやPNGといった画像ファイルは「色の情報の集まり」です。でも、SVGは全く別物。SVGは「画像を描くための命令書（テキストファイル）」なんです。

家の防犯に例えてみましょう。
JPEGやPNGは、完成した「絵画」です。泥棒がその絵画を盗んでも、絵の中に隠し通路はありませんよね。
一方でSVGは、「この線をここに引いて、この色を塗って」という「設計図」なんです。

もしその設計図の中に、こっそりと「この絵が表示されたら、隣の家の鍵を開けろ」という指令（スクリプト）が書き込まれていたらどうでしょう？

ブラウザは律儀なので、SVGを読み込むときにその指令まで実行してしまうことがあります。これがSVGによるXSSの正体です。

—

攻撃者は、SVGファイルの中にこんなコードを埋め込みます。

ユーザーがこの画像をブラウザで開いた瞬間、あなたのサイトのドメイン上でこのスクリプトが動きます。すると、ユーザーのログイン情報（セッションクッキー）が盗まれたり、勝手にパスワードを変更されたりといった被害に繋がってしまうのです。

—

「じゃあSVGを使うのをやめればいいの？」と思うかもしれませんが、アイコンやロゴにSVGは欠かせませんよね。現場では、以下のような「多重の鍵」をかけるのが鉄則です。

一番確実なのは、アップロードされたSVGから