ブラウザキャッシュ対策

Webサイトのファイルキャッシュ残ってしまう系の問題は昔からしょっちゅう目にするので、いい加減少しまとめとく。

画像やJavaScriptやcssを更新した後、ユーザーのキャッシュに古いファイルが残ってて、正しく表示や動作しないことがよくある。
Ctrl+F5押せよって言いたいけどそうもいかないので、キャッシュを制御する設定を入れる。

普通は .htaccess にこんな感じで。

Header set Cache-Control no-cache

でもそんなしょっちゅう変わるわけじゃないし流石に毎回読み直しは…ってことがよくある
なので時間指定することもある。
下記の例で1時間有効。

Header set Cache-Control "max-age=3600"

でも結局ユーザーが使ってるブラウザが上手く設定を理解してくれなかったり、
プロキシサーバーが勝手にキャッシュ残したりするので確実じゃない。

絶対確実にって場合は、ファイル読み込み時にパラメータつけて読み込む方法がある。
以下のように後ろにパラメータつけてやれば、違うファイルと認識して読み直してくれる。
当然、パラメータが以前と同じだったらキャッシュが効いてしまう。
まぁ現在日時を動的に出力すれば事足りると思う。

<img src="./../hoge.jpg?20120229200901" alt="hoge" />