purazumakoiの[はてなブログ]

技術メモから最近はライフログも増えてきてます。

cssなどのファイルの有効期限を設定する

こんなシーンで有用

サイトをリニューアルしたけど、読み込んでいるcssが古いため、キャッシュを読んでしまってサイトが崩れてしまっている。 これはpcで多い印象。

しかしながら、全ユーザーにキャッシュをクリアしてくれと言うこともできず。

そこで予めサイトのキャッシュの有効期限を決めておきましょうと

.htaccessにこう書くテンプレート

<Files ~ ".(gif|jpe?g|png|svg|ico|otf|ttf|eot|woff)$">
Header set Cache-Control "max-age=2592000, public"
</Files>
 
<Files ~ ".(css|js|html|gz)$">
Header set Cache-Control "max-age=604800, public"
</Files>

画像やフォントはおいておくとして css、js、html, gzを最大7日間(604,800秒)のキャッシュ保持としている

リニューアルの1、2週間前に設定しておけば、とりあえず1週間経てばいい感じになります! という担保はできる。 本当はcssのパラメータ付与といった形でデプロイして、リニューアルのタイミングで全員が崩れないようにしたいところだが、WEB制作は、色々他にもやることがおおいので、このあたりは往々にしておなざりにされるので、 そのことも考慮して、キャッシュコントロールは事前にしておいたほうがよい。

参照

www.terakoya.work