Nginx キャッシュヘッダー設定

NginxでexpiresおよびCache-Controlディレクティブを使用してブラウザキャッシュヘッダーを設定し、静的アセットの配信を最適化してサーバー負荷を軽減する方法を解説。

Performance

詳細な説明

キャッシュヘッダーは、ブラウザや中間プロキシにレスポンスのローカル保存期間を指示し、冗長なネットワークリクエストを排除してリピーターのページ読み込みパフォーマンスを劇的に向上させます。

expiresディレクティブ

expires ディレクティブは ExpiresCache-Control: max-age の両ヘッダーを同時に設定します。変更頻度の低い静的アセットに使用してキャッシュヒット率を最大化します。

location ~* \.(jpg|jpeg|png|gif|ico|svg)$ {
    expires 30d;
    add_header Cache-Control "public, no-transform";
}

location ~* \.(css|js)$ {
    expires 7d;
    add_header Cache-Control "public, no-transform";
}

location ~* \.(woff|woff2|ttf|otf|eot)$ {
    expires 365d;
    add_header Cache-Control "public, immutable";
}

Cache-Controlヘッダー

キャッシュ動作をより細かく制御するには、add_header Cache-Control ディレクティブを直接使用します。主な値は:

  • public: ブラウザ、CDN、プロキシサーバーを含むあらゆるキャッシュに保存可能。
  • private: 特定ユーザー向けのレスポンスで、ブラウザのみにキャッシュされる。
  • no-cache: キャッシュは保存済みレスポンス使用前にオリジンサーバーで再検証が必要。
  • no-store: 機密データに適しており、いかなるキャッシュにも保存してはならない。
  • immutable: リソースがmax-age期間中に変更されないことをブラウザに通知し、条件付き再検証リクエストを防止。

ETagとLast-Modified

Nginxはディスクから配信する静的ファイルに対して自動的に ETagLast-Modified ヘッダーを送信します。これにより条件付きリクエストが可能となり、ファイルが変更されていなければ軽量な304 Not Modifiedレスポンスを返して帯域幅を節約できます。

プロキシキャッシュ

バックエンドアプリケーションが生成する動的コンテンツに対して、Nginxは proxy_cache ディレクティブでアップストリームレスポンスをキャッシュできます:

proxy_cache_path /var/cache/nginx levels=1:2 keys_zone=app_cache:10m max_size=1g inactive=60m;

location / {
    proxy_cache app_cache;
    proxy_cache_valid 200 10m;
    proxy_cache_valid 404 1m;
}

キャッシュバスティング戦略

ビルドパイプラインでファイル名にハッシュを付加(例: style.a3b4c5.css)し、バージョン管理されたアセットに使用します。長い有効期限による積極的なキャッシュを可能にしつつ、デプロイ後にユーザーが常に最新版を受け取ることを保証します。

ユースケース

異なるアセットタイプに適切なキャッシュ有効期限を設定し、リピーターが即座にページを読み込めるようにしつつ、コンテンツ更新時には最新版が配信されるようにします。

Try It — Nginx Config Generator

フルツールを開く