Observatory B+で止めた理由
スコアより判断を残す

2026/3/19

セキュリティNext.jsCloudflareコーポレートサイト

コーポレートサイト(satsukilogic.com)を公開してから約1週間が経ちました。

公開後にセキュリティ・パフォーマンス・アクセシビリティの計測を一通り実施し、現時点でのスコアは以下の通りです。

計測に使ったツールは3種類です。PageSpeed InsightsはGoogleが提供する表示速度・SEO・アクセシビリティの診断ツール。Mozilla ObservatoryはMozilla Foundationが運営するセキュリティヘッダーの診断ツールで、HTTPSの設定やCSPの実装状況をA〜Fで採点します。SSL LabsはSSL/TLSの設定を詳細に検査するツールで、暗号化の強度やプロトコルバージョンがA+〜Fで評価されます。

指標スコア
PageSpeed Performance100
PageSpeed ユーザー補助96
PageSpeed おすすめの方法100
PageSpeed SEO100
Mozilla ObservatoryB+(80点)
SSL LabsA+
LCP0.6秒

PageSpeedは全項目100、SSL LabsはA+。一方で、Mozilla ObservatoryはB+止まりです。

なぜA圏を目指さなかったのか。その判断の背景を書いておきます。


やったこと

公開直後の負債監査で、セキュリティ・コード品質・ドキュメントにわたる約20件の課題を洗い出しました。優先度順に対応した主な内容は以下です。

セキュリティ

  • HSTSヘッダーの有効化(Cloudflare設定)
  • CSP(Content Security Policy)ヘッダーの実装
  • セキュリティHTTPヘッダーの追加全般
  • SSL Labs A+取得のためのTLSバージョン最小化(1.2以上)

コード品質

  • TypeScriptのany型排除とエラーハンドリング追加
  • lintエラー6件の解消
  • 不要なコンポーネント(ViewToggleProvider)の削除

その他

  • OGP画像パスの修正
  • .gitignoreの整備
  • ドキュメント類(README、CLAUDE.md)の更新

これらの対応でObservatoryのスコアはDからB+まで引き上げられました。


やらなかったこと、その理由

Observatoryの採点基準で大きく影響するのは、CSPの厳密さです。現在の実装では unsafe-inline を許可しています。これを外せばA圏が見えてきます。

では、なぜ外さなかったのか。

unsafe-inline を除去するには、nonceベースのCSPに移行する必要があります。インラインスクリプトが実行されるたびに、サーバー側でランダムなトークンを生成してHTMLに埋め込み、CSPヘッダーにも同じ値を設定する仕組みです。

技術的には実現可能です。ただ、現状のサイトでは GA4のインライントラッキングスクリプトunsafe-inline に依存しています。さらに、Cloudflare Insightsはエッジレイヤーで自動注入されるため、next.config.ts 側からは制御できません。

つまり、nonceベース移行には以下のコストが伴います。

  • GA4のスクリプト実装の見直し
  • Cloudflare側の挙動との整合確認
  • 将来的にLibrary AIのコンポーネントを埋め込む際の再設計リスク

現時点のトラフィックと運用規模を考えると、このコストは見合いません。ObservatoryのA圏は、Library AIの埋め込みが本格化するタイミングで、CSP全体を設計し直す際に一緒に対応するという判断にしました。


「スコアを上げない」という意思決定

ここで伝えたいのは、スコアが低いことの言い訳ではありません。

「やれるけどやらない」という選択を、理由とともに記録しておくことに意味があると考えています。

完璧なスコアを追いかけることは目的ではありません。サイトが安全に動いていること、将来の拡張に対して無用な負債を積まないこと、限られたリソースを正しい優先順位で使うこと。これらのバランスを取ることがPMとしての仕事だと思っています。

では「安全に動いている」とはどう判断したのか

今回の判断基準を一言で言えば、「今のフェーズで必要な水準を満たしていれば十分」です。具体的には次の3点を確認しました。

通信の暗号化が担保されている:SSL Labs A+は、TLS 1.2以上の接続のみ許可し、古い脆弱なプロトコルが無効化されていることを意味します。通信経路上での盗聴・改ざんのリスクは最小化されています。

HTTPSへの強制リダイレクトが機能している:HSTSヘッダーの設定により、HTTP接続を試みたブラウザは自動的にHTTPSへ誘導されます。ユーザーが誤ってHTTPでアクセスしても、暗号化されていない通信が成立しません。

主要な攻撃経路に対してヘッダーが設定されている:XSS(クロスサイトスクリプティング)やクリックジャッキングといった典型的な攻撃に対して、CSPやX-Frame-Optionsなどのセキュリティヘッダーを設定済みです。

現時点のサイトはコンテンツ閲覧のみで、ユーザー認証や個人情報の取り扱いはありません。この用途において、上記3点が満たされていれば実害リスクは十分低いと判断しました。ObservatoryのB+は、現時点では十分な水準です。SSL Labs A+とPageSpeed 100は、ユーザーに直接影響する指標として優先しました。残ったギャップは、次のフェーズの要件が固まったタイミングで対応します。


透明性をブランド戦略として使う

このブログで技術的な判断の背景を開示しているのは、単なる情報共有ではありません。

「現状と限界を隠さない」という姿勢を、Satsuki Logicのブランドとして意識的に選んでいます。完成した状態だけを見せるのではなく、何を考えてどう判断したかを残す。それが、長期的な信頼につながると考えているからです。

今後もスコアの変化や技術判断の背景は、随時このブログで記録していく予定です。


次回のCSP見直しタイミング:Library AIのサイト埋め込み本格化時。現状のトレードオフはnext.config.tsのコメントに記載済み。