Ajax＋IEでキャッシュは残ってしまう現象の対策

先週、客先からAjaxで動的に表示しているメニューが表示されなくなったという連絡がありました。

こちらでは正常に表示されているし、客先でも一部のみのPCしか表示されないという連絡があり調べてみるとIEのキャッシュが原因でした。

原因

どうやらIEでAjaxを利用する場合、キャッシュをOFFにしとかないと通信処理を行わずローカル内のデータを表示しようとするみたいです。

なので対策としてはAjaxのキャッシュをOFFにする設定を入れてあげればいいだけです。

対策

$.ajax({
   type: "POST",
   url: "some.php",
   cache: false,
   data: "name=John&location=Boston",
   success: function(msg){
     alert( "Data Saved: " + msg );
   }
 });

と【cache: false】をつけるだけでキャッシュが残らなくなり、正しくメニュー表示するようになりました。

一部PCのみだけ発生するっていうのは厄介ですよね。

現象発生するのにも修正後確認するのにも判断しにくいので、対象ブラウザがIE入っている場合、Ajaxをfalseにしてみるのもいいかもしれませんね。