zuntan02のはてなブログ

備忘録的なものです。時々職場の技術者ブログにも転記してますが、メインはこちらで。

Nginxで拡張子指定で静的ファイルをキャッシュするときの注意

nginxの設定例で、以下のようにして静的ファイルをブラウザにキャッシュさせる記述を見かける

server {
  ~
        location ~ .*\.(jpg|jpeg|gif|png|css|js|ico|woff) {
          expires 1h;
        }
}

ただ、この正規表現だと、[.js*]がマッチしてしまうため
hoge.json.php
とか
fuga.js.php
といったようなphpファイルが静的ファイルとして扱われてしまい、実行されない(ダウンロードされてくる)。
具体的には、WebPushツールのOneSignalのWordpressプラグインにそういうのがあった
(参考:https://wordpress.org/plugins/onesignal-free-web-push-notifications/

明示的に拡張子であることを表現するため、末尾のメタ文字($)をつけて

server {
  ~
        location ~ .*\.(jpg|jpeg|gif|png|css|js|ico|woff)$ {
          expires 1h;
        }
}

とすると、hoge.json.phpはサーバサイドで動作(ダウンロードされない)します。


※念のため、変更後、jpgやjsなどについてはレスポンスヘッダの
Cache-Control: max-age=xxxx(expires 1hなら3600)を確認しておいてください