javascriptで、キャッシュを再実行させたい。どうすればよいですか？

Question

さっき質問して、はやとちり。解決したと思ったら、していませんでした。そこで、
もう一度質問させてください。

質問は：
javascriptで、reload()すると、サーバーに読みにいきますが、
サーバーに読みにいかずに、キャッシュを再実行させたいときは、
どうすればよいのでしょうか？ なにか関数がありますか？
location.reload(false)でできるはずですが、わたしのところ
では、サーバーに読みにいってしまいます。ブラウザはchrome。
どなたか、よろしくお願いします。

Comments

[kei344]

「できるはず」はどこかにかいてありましたか？URLか書誌情報を質問文に追記ください。

[unau]

「キャッシュを再実行の意味がわかりません。「キャッシュ」は一度計算したもの、一度持ってきたものを、(最新版との不整合のリスクをかかえつつも、) 時間短縮のために結果だけ保存しておく記憶領域のことです。キャッシュからは「取り出す」ことはできますが、キャッシュを実行することはできません、普通。ページ全体のリロードをキャッシュから行いたいと理解でよいのでしょうか。

[kei344]

ここは「質問への追記・修正の依頼」です。質問本文は編集することが可能なので、その依頼をしています。unauさんのへのコメントの内容を含め質問に追記されてはいかがでしょうか。

Answer 1

キャッシュとは、一般的に、結果を得る (計算する、どこからかもらってくる) のに時間がかかる場合に、最新版との不整合のリスクをかかえつつも、時間短縮のために結果だけ保存しておく記憶領域、およびそこに格納した結果のことです。

ブラウザにおけるキャッシュとは、ページ (html) や画像、スタイルシートやスクリプトなど、一回取ってきたものを、再表示を速くするために保存しておくものです。
location.reload(false) は、「現在のページをキャッシュからリロードするよ」というものですが、キャッシュの中に必要なものがなければ、当然、サーバまで取りにいかなければなりません。すなわち、「現在のページをキャッシュにあるものはキャッシュから、ないものはサーバにもう一度取りにいってリロードするよ」という意味です。ですので、キャッシュにデータがない場合は location.reload() と同等の動作になります。

で、前述したように、キャッシュのメリットは時間短縮 (計算コスト・通信コストの削減) ですが、デメリットは最新データとの乖離とキャッシュエリアの消費 (メモリやストレージのコスト) です。このバランスを取るために、キャッシュの設定はクライアント (すなわちブラウザ) でもサーバでも行えます。このキャッシュの設定いかんによっては、常にキャッシュされないページがありえます。

たとえば、クライアント側で「常にキャッシュしない」という設定になっていれば、当然、一切キャッシュされません。キャッシュ領域のサイズが極端に小さければほとんどキャッシュされないでしょう。

もっとあり得るのは、サーバ側が「キャッシュしないでよ」と指定してコンテンツを返してくることです。情報が刻々と変化していて、常に最新版を取りにきてもらわないと困る場合などです。この指定を受けた場合、クライアントはキャッシュを保存しません。
サーバ側からどんなキャッシュコントロールができるのか、については、次の記事などを見るとよいかと思います。

-キャッシュについて整理してみた - Qiita
-ブラウザのキャッシュコントロールを正しく理解する - Qiita

と、前置きが長くなりましたが、キャッシュされているかどうかの確認はできていますか。

Comments

[AtaruOgura]

このコメント欄に記入するのは初めてで、記入要領がよくわかっていません。ヘンな書き方をお許しください。
kei344さん、ありがとう。
Qiitaで、 JavaScript 現在のページをリロードしたいhttp://qiita.com/39_isao/items/1c26314d1dae8be539a5にありました。

unauさん。丁寧にありがとうございます。
一回ページを開けたあと、ブラウザchromeの←で前のページに戻り、前のページの→すると、
さっき開けたページがすごく手早く開きます。それでキャッシュしていると思っておりました。
そのページは、javascriptでアニメ的に描画するもので、サーバーに再読み込みすると、描画に必要なパラメータとして別の値が与えられるので、異なった絵が描かれてしまうのです。
Quiitaには、Cache-Controlヘッダは仕様通り実装されていない？（http://qiita.com/shibukawa/items/bdf56e0adbc292666cfb）というのもありまして、
HTMLのヘッダーでキャッシュを使う使わないをコントロールできるかどうかは、疑いがあるということのようですので、これを避けたいのです。そこで、ペ―ジにボタンを置いて、それを押せば、同じアニメを再描画したいと思ったのでした。onClick="location.reload(false)" では、私のchromeではonClick="location.reload(true)"と同じ動作でして、あーあ、やれ困っちゃったなぁ、という状況です。
ブラウザのbackボタンでもどり、そのページからフォワードすれば、同じアニメ動作がしますので、それと同じことをjavascriptの関数で欲しいと思った次第です。古籏さんのjs逆引きハンドブックや山田さんのjs逆引きレシピでも見つけられておりません。代案として、アニメする部分はjsの自作関数で記述しているので、そのjsの自作関数を呼び出してみたのですが、これも半分しか動作しません。半分というのは、背景画像は描いてくれるが、そこから別の自作関数を呼び出して本図は描けないのです。（この関数は、最初のページ表示の時には全く支障なく本図も描きますので、動作上のバグはないと思います。その関数で使っているグローバル変数を読めないのかと疑って点検してみましたが、症状は直りませんでした）問題を拡散させても仕方がないので、javscriptのonClick="location.reload(false)"みたいな簡単な記述でできる方法がないのかという観点に未練があります。ご教示いただければ、ありがたいです。お手数かけて申し訳ありません。

[unau]

このあたりの事情も、背景情報として、もとの質問に書いておいたほうがよかったでしょうね。
言及されていますが、ご自身で作っている WEB アプリであれば、自作の js をきちんと動作する方向がいいと思います。というのも、location.reload() の使用でどうにかなったとしても、それではブラウザ依存の対処法となってしまい、検証もたいへんですし、ブラウザのバージョンアップできちんと動作しなくなってしまうかもしれませんし。
そもそもアニメの再描画が目的であれば、もしかしたらメモリにないかもしれないデータをキャッシュから拾うより、適切な js を使ってメモリ上で処理したほうが、まっとうだし速いかもしれません (少なくとも遅くはならないはず)。