前回は、 ajax( options ) のオプションリストの中から、async とbeforeSendを試してみましたが、今回も引き続き残りのオプションを試していきます。

jQueryの取得などについては下記リンクをご参照ください。

ajax( options ) のoptions.cache

今回は、cacheです。cacheは、HTTP通信のキャッシュ機構を回避して、Ajaxのサーバーレスポンスを常に新鮮なデータで受け取るためのフラグです。初期値はtrueですが、キャッシュしたくない場合には、falseを指定します。また、dataTypeがscriptでcacheの指定が無い場合にはfalseになります。

ここでいうキャッシュは、いうまでもなくWebキャッシュのことです。それは、すでにブラウザが取得、もしくは近隣のプロクシサーバーが取得済みのデータには、一時記憶であるキャッシュを利用することで、何度も受け取る無駄を避けるためのものです。

これは、ネットワークの回線速度が遅かったり、データサイズが大きい場合などに有効ですが、実は、せっかく新しいページをアップロードしたのに、なかなか更新されないといった弊害も起こり得ます。

特にAjaxでは、リアルタイムなキビキビとした動作が求められることが多いので、GETメソッドのURLクエリに、たとえば、(new Date()).getTime()などのユニーク(一意)な値を与え、毎回異なったURL文字列をリクエストすることで、キャッシュを回避する手がよく使われています。

今回のjQueryのcacheでも、同様に、cache:falseの場合には、たとえば、URLの後ろに「_=1238121034035」といったアンダースコアパラメータが付加される仕組みになっています。

では、下記のサンプルボタンを押してみてください。それぞれのパラメータを変えてURLを確認します。
(ブラウザのキャッシュが有効になっている必要があります)

【type:GETでcache:false】
【type:GETでcache:true】
【type:GETでcache省略】
【type:POSTでcache:false】
【type:POSTでcache:true】
【type:POSTでcache省略】
【type:GETでdataType:"script"】


上記サンプルは、ボタンクリックで、サーバーの ./test1.txt?pram1=3 というURLへ $.ajaxメソッドでリクエストを出しています。

その時のURLを出力してみることで、キャッシュを回避するパラメータ「&_=...」を付加しているかどうかを確認しています。

そこで、上記の各サンプルボタンを押すと、結果は、たとえば次のようなものになります。
【type:GETでcache:false】./test1.txt?pram1=3&_=1238125376453
【type:GETでcache:true】./test1.txt?pram1=3
【type:GETでcache省略】./test1.txt?pram1=3
【type:POSTでcache:false】./test1.txt?pram1=3
【type:POSTでcache:true】./test1.txt?pram1=3
【type:POSTでcache省略】./test1.txt?pram1=3
【type:GETでdataType:"script"】./test1.txt?pram1=3&_=1238125385140
つまり、【type:GETでcache:false】の場合と【type:GETでdataType:"script"】の場合に、 Ajaxのリクエスト先であるURLに「&_=1238125376453」といったパラメータが付くというわけです。

そして、「1238125376453」の部分は「new Date」で作成されているので、1/1000秒ごとに異なる重複しない数値となります。 そのため、URL文字列はリクエストされるごとに(ほぼ必ず)前回のリクエストとは異なるものになるわけです。

注意が必要なのは、このふたつ以外が、どれもすべて、キャッシュされるというわけではなく、このふたつだけは、ブラウザやサーバーなどの設定にかかわらず、キャッシュを回避できるという点です。

たとえば、キャッシュを設定していなければ、当然ながら、このcacheの値にかかわらず、キャッシュはしません。 キャッシュのふるまいは、各ユーザー毎のブラウザやサーバーの設定次第で変わります。

では、次ページは、上記サンプルのソースを見てみましょう。