技術

セキュリティヘッダーとは何か、なぜサイトに必要なのか

専門用語なしで、サイトを訪れるすべての人を静かに守る小さなサーバー設定を解説します。

概要

ブラウザがページを読み込むたびに、サーバーはページ本体に加えて、どこにも表示されない短い指示リストを一緒に送っています。これを「ヘッダー」と呼びます。中にはセキュリティのためだけに存在するヘッダーもあり、「ファイルの種類を勝手に推測しないで」「私のページを別サイトの見えないフレームに埋め込ませないで」といった指示をブラウザに伝えます。これらはサイトの見た目にはまったく影響せず、訪問者からは完全に見えない状態で、裏側で静かに動いています。

重要な理由

これらの設定がないと、ブラウザは何十年も前からある、より制限の緩い既定の動作にとどまります。一部の攻撃はまさにこの緩さを利用しており、例えばファイルの種類をだまして本来と違う形式として実行させたり、ログインページを別サイトに見えない形で埋め込んで入力情報を盗んだりします。セキュリティヘッダーがないからといって今すぐ何かが目に見えて壊れるわけではありませんが、セキュリティを気にする訪問者やビジネスパートナー候補、自動スキャナーが真っ先にチェックする項目の一つであり、「何も設定されていない」状態はまだ作り込みが終わっていないサイトに見えてしまいます。

修正方法

  1. 自分のサイトがどのようにホスティングされているかを確認します。NetlifyやVercel、Cloudflare Pagesのような静的ホスティング、cPanelなどの従来型のWebホスト、あるいは自前のサーバーのいずれかです。
  2. NetlifyやCloudflare Pagesの場合、公開フォルダに_headersという名前のプレーンテキストファイルを追加し、X-Content-Type-Options: nosniffのような行を書きます。どちらのプラットフォームもコード不要で自動的に適用します。
  3. Vercelの場合、vercel.jsonファイルにheadersセクションを追加し、同じヘッダー名と値を記載します。Vercelの公式ドキュメントにこのケース用のコピペ可能な例があります。
  4. 従来型のホストや自前のサーバーの場合は、ホスティングのサポートに問い合わせるか、「[ホスト名] セキュリティヘッダー 追加」で検索してください。ほとんどのホストは管理画面向けの具体的な手順を用意しています。
  5. 最低限、X-Content-Type-Options: nosniffReferrer-Policy: strict-origin-when-cross-originを追加しましょう。この2つは安全でシンプルであり、ほぼどんな小規模サイトにも適しています。
  6. 設定後にLaunch Readinessのチェックを再実行し、ヘッダーが検出されるようになったか確認してください。

あなたのサイトにもこの問題がないか確認しましょう

Launch Readinessは、この問題を含む約50項目を数秒でチェックします — 無料・登録不要。

無料でチェックする