画像をブラウザのキャッシュから読み込ませない方法。


ちょっと説明がめんどいのですが、頑張ります。
写真をアップする画面を作っているのだけど、
「更新(F5)」を押さないと新しい画像が切り替わらなかったりします。


ブラウザの判断は同じ名前の場合、画像はキャッシュ優先です。
ファビコンなんかを変更しても、すぐには変わってくれないのとおんなじ現象。


方法として、ファイル名の後ろに引数を渡してあげればいい。
「xxxxx.jpg?aaaaa」
みたいな感じで。aaaは適当に毎回変わるようにして。
これで、とりあえずは毎回サーバから画像を取ってきてくれる。


この方法は、HTMLをサーバ側で編集するタイミングがないと面倒っすね。
jspとかrailsとかじゃないと簡単には出来ないなぁ〜。
jqueryを使うとこんな感じになるのか??

$("#ID").attr("src","IMG_URL?" + 適当な毎回変わる値);

つか、javascriptで画像読ませてもやっぱりキャッシュ優先するっぽい。
(調べてないからわかんないけど。)
上記コードを読み込み時に実行する事で同じことはできそう。
しかしなぁ〜。しっくりこず。


ちなみに
このやり方だとブラウザのキャッシュが無限に増えるような気がする。


Firefoxの「about:cache」コマンドで見てみると


やっぱり。同じものがあった。

<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Expires" content="0">


を入れたところで画像のキャッシュは関係ないだろうし。
ダメもとでExpiresも「0」を設定してキャッシュしないでね。っていったところで、
あいかわらず画像は関係ないらしい。



あとは自動で消えてくれることをまつか。。
調査対象の数値は「1301350771544」と「1301350769723」
あと、firefoxの場合キャッシュをみるコマンドは
「about:cache?device=disk」

ちなみに、最後の列がexpire


明日ぐらいに追記します。