バニラのHTMLでサイトを管理するときに気をつけるべきセキュリティ対策

バニラのHTML（いわゆる“静的サイト”）は、サーバー側の処理やデータベースを持たないぶん、攻撃面が少なく比較的安全と言われます。しかし、安全なのは「正しく運用できている場合」に限られます。実際には、CDN・外部スクリプト・フォームサービス・解析タグ・デプロイ手順など“周辺”が弱いと、静的でも十分に狙われます。

本稿では、静的サイト特有の脅威と、今日の運用で必須の対策を体系的にまとめます。

まずは脅威モデルを理解する

サプライチェーンのリスク

外部CDNのライブラリ、広告・解析タグ、SNS埋め込みなど、第三者のコードがページで実行されます。改ざん・乗っ取り・なりすましが起きると、ユーザーのブラウザで被害が発生します。

配信経路・ホスティングのリスク

HTTPS・証明書・DNS・CDN設定・SFTP/SSH鍵の管理が甘いと、盗聴・改ざん・乗っ取りに繋がります。

コンテンツ差し替え・改ざん

Gitやストレージ、ビルド成果物、サーバー上のファイルに不正アクセスされると、静的ファイルでも容易に置き換えられます。

埋め込み・リンク由来のリスク

target=_blank のタブナビング、危険なiframe埋め込み、無制限のCORSなど、フロントエンド設定の不備から攻撃されます。

プライバシー・法令順守

不要なデータ収集、クッキー同意無しのトラッキング、誤ったログ保持などは法令・規約に抵触しやすく、ビジネス上の重大リスクです。

技術設定まわりの必須対策（静的サイトでも“今は必須”）

常時HTTPS化と強制リダイレクト

すべてのページをHTTPSで配信し、HTTPへ来たアクセスはHTTPSへ自動リダイレクトする運用にします。証明書の自動更新（Auto-Renew）も忘れずに。

強力なHTTPレスポンスヘッダー

コード不要でも、サーバーやCDNの設定でセキュアにできます。代表例は以下です。

Content Security Policy（CSP）：読み込むドメインをホワイトリスト化し、インラインスクリプト・外部スクリプトを厳格に制御します。まずは Report-Only で誤ブロックを検証し、段階的に厳しくします。

HSTS：ブラウザにHTTPSのみを使わせ、ダウングレード攻撃を防ぎます。

X-Content-Type-Options / MIME Sniffing防止：意図しない実行を防ぎます。

Referrer-Policy：参照元URLの漏えいを最小化します。

Permissions-Policy：カメラ・マイク・位置情報・フルスクリーン等のAPIをデフォルトで無効化します。

Frame系対策（CSPのframe-ancestors等）：クリックジャッキングを避けます。

外部スクリプトの最小化・固定化

解析タグやUIライブラリは“必要最小限”にし、提供元を厳選します。バージョン固定・ハッシュ検証（SRI）・サブリソースの定期棚卸しを行い、不要になったタグは削除します。可能なら自前ホスティングで依存先を減らします。

CORSの原則“閉鎖”

静的APIレスポンスやアセットに対して * 相当の許可を行わず、必要なオリジンだけを許可する方針にします。

iframe埋め込みの安全化

埋め込みは原則最小限。提供元を厳選し、不要な権限（フルスクリーン、決済、カメラ等）は許可しない方針を徹底します。

リンクのタブナビング対策

新しいタブで外部リンクを開く設計のときは、タブ乗っ取り対策を有効にします（設計ポリシーとして明文化しておきます）。

ディレクトリリスティング無効化・余計なエラー情報の非表示

ファイル一覧が見える設定は情報漏えいです。404/500等のエラーページにも、サーバー名や詳細スタックを出さない方針にします。

運用まわりの必須対策（“人と手順”の堅牢化）

デプロイ経路の秘匿化と権限分離

FTPは使わず、SFTP/SSH鍵や専用のデプロイキーを利用します。公開鍵は必要最小限の権限に限定し、不要になった鍵は即時削除。作業者ごとに資格情報を分け、共有しません。

ホスティング・CDN・DNSのアカウント保護

2段階認証（MFA）を必須化、長いランダムなパスワード、定期的な権限レビュー。レジストラロックやDNSSECの適用も検討します。

WAF／レート制限／Bot対策の活用

CDNのWAFを有効化し、怪しい国・ASNのトラフィック、スキャン行為、特定パスへの過剰アクセスをレート制限。必要に応じて国別ブロックも検討します。

変更管理（Change Management）

Gitで履歴を管理し、PRレビュー・CI経由でのみ公開する運用に統一します。直接サーバー上で編集しないのが鉄則です。タグやリリースノートで変更の可視化も行います。

バックアップとロールバック手順

アセット・HTML・設定を定期バックアップし、復元手順を文章化しておきます。バックアップの暗号化・外部保管・復元テストの実施が肝心です。

監視と検知

稼働監視（ステータス監視、証明書期限、DNS変更検知）、改ざん検知（ハッシュ照合・差分監視）、アナリティクス異常検知（急増・急減）を仕組み化します。連絡先を示す「security.txt」の設置も有益です。

外部サービス・フォームを使うときの注意

フォームサービスの選定

HTTPS対応、スパム対策、レート制限、保存データの保護方針を確認します。受信メールに個人情報を載せない設定、通知の暗号化、保管期間の最小化を徹底します。

ファイルアップロードの扱い

静的サイトでのファイル受け取りは基本避け、必要な場合は信頼できるストレージとウイルススキャンを用意します。ユーザーがアップしたファイルをそのまま配信しない方針を取ります。

埋め込みウィジェットの権限評価

チャットボット、決済、広告、SNSなどは、最小権限・最小スコープで導入します。不要になったものは即撤去します。

プライバシーと法令順守

データ最小化の原則

解析タグ・広告タグは必要最小限。IPの匿名化、計測のオプトアウト、クッキー同意の適切な実装方針を決めます。

ポリシー整備

プライバシーポリシーとクッキーポリシーを整備し、問い合わせ窓口を明示します。第三者提供や再委託の有無、保存期間、利用目的を具体的に記載します。

ログ管理

収集するログ（アクセスログ、WAFログ等）の保存期間・アクセス権限・暗号化を定義します。個人情報が写らないよう配慮します。

クリエイティブ素材と情報漏えいの最小化

画像・PDFのメタデータ

撮影場所や端末情報などのEXIFを必要に応じて除去します。PDFのプロパティ・埋め込み情報にも注意します。

ステージングURLの露出防止

テスト環境やドラフトURLを外部からクロールされないようにし、公開前のリンク共有は限定的に行います。

よくある落とし穴

「静的だから安全」と思い、CSPもHSTSも未設定。

外部JSを多数読み込み、誰も棚卸しせず数年放置。

FTPや共有パスワードを使い回し、退職者アカウントの無効化を失念。

解析タグや広告の設定だけ残して非稼働、しかし権限は生きておりリスクに。

証明書の期限切れやDNS乗っ取りに気づく仕組みがない。

404/500ページにサーバー詳細やバージョンを出してしまう。

スターターチェックリスト（運用に組み込むと安全度が上がります）

 常時HTTPS（自動更新）とHSTSを有効化

 CSPをReport-Onlyで検証→本番適用、Permissions-PolicyやReferrer-Policyも設定

 外部スクリプトを最小化・棚卸し、不要タグの撤去、可能なら自前配信

 CORSは原則閉鎖、iframeは最小限・最小権限

 デプロイはGit + CI/CD、サーバー直接編集は廃止

 アカウントはMFA必須、鍵・権限の定期レビュー

 CDNのWAF・レート制限を有効化

 バックアップとロールバック手順を整備し、復元テストを実施

 稼働監視・改ざん検知・証明書期限・DNS変更の監視を常設

 プライバシーポリシー整備、データ最小化と同意管理

 画像・PDFのメタデータ点検、ステージングURL露出防止

まとめ

静的サイトのセキュリティは「サーバーサイド機能が少ない＝安全」ではなく、配信・依存・運用の三つ巴です。

外部依存を最小化し、配信経路を堅牢化し、運用の“人と手順”をセキュアに保てば、バニラHTMLでも十分に強いサイトになります。逆に、ここを怠ると静的でも簡単に突破されます。今日の静的運用は、“軽量”であると同時に“堅牢”であることが求められます。