X-Frame-Options とは。クリックジャッキングを防ぐ設定は必要か

ひとことで

X-Frame-Options は、「このページを、ほかのサイトの中に枠として埋め込んで表示しないでください」とブラウザに伝える設定です。サイトの応答にヘッダーという形で 1 行付けます。値は、埋め込みを一切させない DENY か、自社サイトの中だけ許す SAMEORIGIN が一般的です。

無いと何が起きるか

悪意のあるサイトが、自社のページを透明にして自分のページの上に重ねて表示できます。訪問者は別のボタンを押したつもりで、実際には自社ページのボタンを押してしまう。これをクリックジャッキングといいます。

会社案内だけのページなら影響は小さいのですが、ログイン後の画面や、ボタン 1 つで申込み・送信が完了する画面があると、本人の意図しない操作をさせられる余地が生まれます。

必要か

自社のページをほかのサイトに埋め込んで使う予定がないなら、設定して損はありません。費用はかからず、見た目も変わりません。

同じことは CSP（Content-Security-Policy）の frame-ancestors という指定でもできます。frame-ancestors の方が新しい書き方で、「このサイトにだけは埋め込みを許す」と細かく決められます。古いブラウザへの配慮から、両方を付けておくのがよく見られる形です。

頼み方

制作会社・保守担当には「X-Frame-Options: SAMEORIGIN と、CSP の frame-ancestors ‘self’ を付けてください」と伝えれば通じます。サーバーの設定や .htaccess、WordPress ならプラグインで設定できることが多いです。