キャッシュヘッダーチェッカー

URLを入力するだけでHTTPキャッシュヘッダー7項目を解析し、ブラウザ/CDNキャッシュの設定状況をスコアリングします。

URLを入力するとHTTPキャッシュヘッダー7項目を解析し、ブラウザ/CDNキャッシュの設定状況を表示します

URLを入力してキャッシュ設定をチェックしましょう

Cache-Control・ETag・CDNステータスなど7項目を自動検査します

HTTPキャッシュヘッダーとは

HTTPキャッシュヘッダーは、Webサーバーがブラウザやプロキシ、CDNに対してリソースのキャッシュ方針を指示するためのHTTPレスポンスヘッダーです。 適切に設定することで、リピートアクセス時のページ表示速度を大幅に改善し、サーバーへの負荷を軽減できます。

GoogleのCore Web Vitals(特にLCP: Largest Contentful Paint)の改善にキャッシュ設定は直結します。 PageSpeed Insightsでも「効率的なキャッシュポリシーの使用」が監査項目に含まれており、SEOにも間接的に影響します。

検査対象の7つのキャッシュヘッダー

ヘッダー名カテゴリ目的
Cache-Controlブラウザキャッシュの有効期限・動作を制御する最も重要なヘッダー
ETag検証コンテンツのバージョン識別子。条件付きリクエスト(304応答)に使用
Last-Modified検証リソースの最終更新日時。If-Modified-Sinceによる条件付きリクエストに使用
Expiresブラウザキャッシュの有効期限(HTTP/1.0互換)。Cache-Controlが優先される
AgeCDNCDNキャッシュ上のリソース経過時間(秒)
Varyブラウザコンテンツネゴシエーション用。キャッシュキーの一部になるヘッダーを指定
CDN Cache StatusCDNCDNキャッシュの状態(HIT/MISS)。Cloudflare・Vercel・Fastly等のステータスを検出

スコアの見方

各ヘッダーの設定状況を「設定済み」「要確認」「未設定」の3段階で判定し、100点満点のスコアを算出します。 また、ブラウザキャッシュとCDNキャッシュの状態を別々に判定します。

  • 70点以上: キャッシュが適切に設定されています
  • 40〜69点: 一部のキャッシュ設定が不足しています
  • 39点以下: キャッシュ設定の見直しが必要です

Cache-Controlの主要ディレクティブ

ディレクティブ説明
max-age=秒数ブラウザキャッシュの有効期間
s-maxage=秒数CDN/プロキシキャッシュの有効期間
publicCDN/プロキシにキャッシュを許可
privateブラウザのみキャッシュを許可
no-cacheキャッシュ前にサーバーで再検証が必要
no-storeキャッシュを一切保存しない
immutableコンテンツが変更されないことを宣言
stale-while-revalidate期限切れキャッシュを返しつつバックグラウンドで再検証

キャッシュヘッダーの設定方法

  • Next.js / Vercel: next.config.tsheaders()Cache-Control を設定。静的アセットは自動的に immutable が付与される
  • Apache: .htaccessmod_expires または Header set Cache-Control で設定。.htaccessジェネレーターで生成可能
  • Nginx: expires ディレクティブまたは add_header Cache-Control で設定
  • Cloudflare: ページルールまたはCache Rules で Browser TTLEdge TTL を設定
  • WordPress: W3 Total CacheやWP Super Cacheプラグインでブラウザキャッシュを有効化

活用シーン

  • PageSpeed Insights改善: 「効率的なキャッシュポリシーの使用」の監査対応。ページ速度チェッカーと併用して改善効果を確認
  • CDN導入効果の確認: CDNキャッシュが正しくHITしているか検証する
  • サーバー移行後の確認: インフラ変更後にキャッシュヘッダーが正しく引き継がれているか検証する。セキュリティヘッダーチェッカーも合わせてチェック
  • 静的リソースの最適化: CSS/JS/画像に適切なmax-ageが設定されているか確認する

このツールの使い方

  • チェックしたいWebサイトのURLを入力して「チェック」ボタンを押します
  • HTTPレスポンスヘッダーが自動取得され、7項目のキャッシュヘッダーが検査されます
  • ブラウザキャッシュ・CDNキャッシュの状態とスコアが表示されます
  • 各ヘッダーの判定理由と現在の設定値を確認し、改善に活かします

ツールの仕様・制限事項

  • 指定URLにHTTPリクエストを送り、レスポンスヘッダーを解析します
  • リダイレクトは最大5回まで追従します
  • レスポンスのタイムアウトは10秒です
  • CDNキャッシュステータスはCloudflare(CF-Cache-Status)、Vercel(X-Vercel-Cache)等を検出します
  • 入力されたURLの情報はサーバーに保存されません

このツールが役に立ったらシェアしてください

Share:

ご意見・ご要望をお聞かせください

Powered by IdeaSpool

関連記事

よくある質問

Q. Cache-Controlが未設定だとどうなりますか?
Cache-Controlが未設定の場合、ブラウザやCDNのキャッシュ動作がブラウザのヒューリスティック(推測)に依存します。意図しないキャッシュ期間が適用されたり、キャッシュが全く効かなかったりする可能性があるため、明示的な設定を推奨します。
Q. CDNキャッシュステータスが「不明」と表示されます
CDNを使用していない場合、またはCDNがキャッシュステータスヘッダー(CF-Cache-Status, X-Vercel-Cache等)を返さない設定の場合に「不明」と表示されます。CDNを利用している場合は、管理画面でレスポンスヘッダーの設定を確認してください。
Q. ETagとLast-Modifiedの違いは何ですか?
どちらもキャッシュの再検証(条件付きリクエスト)に使用されますが、ETagはコンテンツのハッシュ値に基づく正確なバージョン管理、Last-Modifiedは最終更新日時に基づく比較です。ETagの方が精度が高く、両方設定するのが理想的です。

関連ツール

開発者

Zeronova avatar

Zeronovaゼロノバ

Product Manager / AI-Native Builder

19年以上のWeb/IT業界経験を持つPdMが、現場で本当に使えるツールを開発。登録不要・ブラウザだけで動作する無料ツールを93種類以上公開中。