iframeのセキュリティ：クリックジャッキングとX-Frame-Options

クリックジャッキング（UIレッドレス攻撃）は、標的サイトを透明なiframeに埋め込み、おとりページの上に重ねます。ユーザーはおとりをクリックしているつもりでも、実際にはその下にある認証済みページをクリックするため、本人が知らないうちに標的サイト上で操作が実行されます。

攻撃者はvictim.comを透明なiframeに読み込み、「Click to win!」というボタンの上に配置します。ユーザーがクリックすると、実際にはvictim.comの「Delete Account」ボタンをクリックすることになります。victim.comのセッションCookieによって、ユーザー自身として認証された状態です。フィッシングは必要ありません。

X-Frame-Options: DENYは、ページがどのiframeにも読み込まれないようにします。X-Frame-Options: SAMEORIGINは、同じオリジンのページからのみiframeに読み込めるようにします。クリックジャッキングを防ぐため、認証が必要なすべてのページで、このヘッダーをサーバー側で設定してください。

Content-Security-Policy: frame-ancestors 'none'は、X-Frame-Options: DENYに代わる、より柔軟な現代的手段です。frame-ancestors 'self'はSAMEORIGINに相当します。frame-ancestorsでは、frame-ancestors https://trusted.example.comのように、信頼する特定のオリジンを許可することもできます。

従来のフレームバスティングでは、JavaScriptを使ってフレームから抜け出していました。しかし、sandbox属性によってフレームバスターのスクリプトがブロックされるため、簡単に無効化されます。必ずサーバー側のヘッダー（X-Frame-OptionsまたはCSPのframe-ancestors）を使用してください。JavaScriptによるフレームバスティングは信頼できません。

フレーミングが正当に必要となる例には、自分のコンテンツを自分のオリジンに埋め込む場合（SAMEORIGIN）や、特定のパートナーによるウィジェットの埋め込みを許可する場合（特定のオリジンを指定したframe-ancestors）があります。こうしたケースは許可し、それ以外はすべて拒否するようにポリシーを設計してください。

対応範囲を最大限に広げるため、X-Frame-Options（古いブラウザー向け）とCSPのframe-ancestors（最新のブラウザー向け）の両方を設定してください。両方が存在する場合、CSPをサポートするブラウザーではframe-ancestorsが優先されます。両方を送信することで、すべてのユーザーエージェントに対してクリックジャッキングを防止できます。

同一オリジンのiframeにもリスクがあります。埋め込まれたページに保存型XSSがあると、同一オリジンであるためparent.documentを通じて親ページにアクセスできる可能性があります。親ページへのアクセスが不要な同一オリジンiframeには、allow-same-originを指定しないsandboxを使用し、埋め込みコンテンツの脆弱性による被害を抑えてください。

クリックジャッキング対策を検証するには、ブラウザーのネットワークタブで、レスポンスヘッダーにX-Frame-OptionsまたはCSPのframe-ancestorsが含まれていることを確認してください。securityheaders.comなどのツールでヘッダーを分析できます。サイトを指すiframeを含むテスト用HTMLページを作成し、読み込みに失敗することを確認してください。

サードパーティのコンテンツ（YouTube、Google Mapsなど）を埋め込む場合、あなたがフレーミングするサイトになります。埋め込むサービスが、自身のX-Frame-Optionsポリシーでフレーミングを許可していることを確認してください。フレーミングを拒否しているサイトを埋め込むことはできません。これは設計どおりの動作であり、埋め込まれるサービスのユーザーを保護します。

ほとんどのCSPディレクティブとは異なり、frame-ancestorsはHTTP-equivメタタグで設定できません。HTTPレスポンスヘッダーとして配信する必要があります。これにより、ブラウザーがメタタグを読み取る前に埋め込みHTMLを操作して、攻撃者が保護機能を削除することを防げます。

JavaScriptによるフレームバスティングコードが、クリックジャッキング対策として信頼できないのはなぜですか。

クリックジャッキングは、認証済みページを透明なiframeに埋め込み、クリックを乗っ取ります。対策として、サーバー側でX-Frame-Options: DENYまたはCSPのframe-ancestors: noneヘッダーを設定します。クロスブラウザー対応のため、両方を設定してください。JavaScriptによるフレームバスティングは信頼できないため、必ずHTTPヘッダーを使用してください。frame-ancestorsを使うと、X-Frame-Optionsではできない、信頼するオリジンのきめ細かな許可リストを設定できます。