HTMLで画像を表示するにはimgタグを使用しますが、一度使用した画像はブラウザにキャッシュされるため意図しない画像が表示されてしまう場合があります。
こうした場合に画像のキャッシュを使用しない方法です。
解説
キャッシュを使用させないためには、ファイル名に何らかのパラメータを付加します。
1 2 3 4 5 |
//ファイル名にパラメータを付けない場合 <img src="hoge.jpg"> //ファイル名にパラメータを付けた場合 <img src="hoge.jpg?var=201712101634"> |
ブラウザは以前に読み込んだファイルと同じファイル名だとキャッシュを優先します。
しかし、ファイル名が同じでもパラメータが異なるとキャッシュを使用せず再度読み込みに行こうとするため、新たなパラメータを設定するとキャッシュを使用させなくすることができます。
補足
- パラメータはjsファイル名の後ろに、?<パラメータ名>=<値>の形式で指定します。
例)hoge.jpg?var=123 - 付加するパラメータは、何でも構いません。
- 一度使用した(キャッシュ済み)パラメータとは異なるパラメータを指定してください。