AJAX緩存清理

Ajax頁面緩存是ajax處理數據時對一些重復相同數據進行一個緩存操作，這樣從另一個層面對於我們來講是非常的不錯了，但有時我們並不希望它緩存要如何處理呢？下面我們一起來看看關於頁面緩存問題分析與解決，希望例子對各位會帶來幫助。

一、什么是Ajax緩存原理？

Ajax在發送的數據成功后，會把請求的URL和返回的響應結果保存在緩存內，當下一次調用Ajax發送相同的請求時，它會直接從緩存中把數據取出來，這是為了提高頁面的響應速度和用戶體驗。當前這要求兩次請求URL完全相同，包括參數。這個時候，瀏覽器就不會與服務器交互。

二、Ajax緩存的好處

這種設計使客戶端對一些靜態頁面內容的請求，比如圖片，css文件，js腳本等，變得更加快捷，提高了頁面的響應速度，也節省了網絡通信資源。

三、Ajax緩存的不足

Ajax緩存雖然有上述的好處，但是如果通過Ajax對一些后台數據進行更改的時候，雖然數據在后台已經發生改變，但是頁面緩存中並沒有改變，對於相同的URL，Ajax提交過去以后，瀏覽器還只是簡單的從緩存中拿數據，這種情況當然就不行了。

四、解決Ajax緩存問題的方法

解決這個問題最有效的辦法是禁止頁面緩存，有以下幾種處理方法：

1、在ajax發送請求前加上 xmlHttpRequest.setRequestHeader(“Cache-Control”,”no-cache”);

2、在服務端加 header(“Cache-Control: no-cache, must-revalidate”);

3、在ajax發送請求前加上 xmlHttpRequest.setRequestHeader(“If-Modified-Since”,”0″);

4、在 Ajax 的 URL 參數后加上 "?fresh=" + Math.random(); //當然這里參數 fresh 可以任意取了

5、第五種方法和第四種類似，在 URL 參數后加上 "?timestamp=" + new Date().getTime();

6、用POST替代GET：不推薦

7、jQuery提供一個防止ajax使用緩存的方法：

<script type="text/javascript" language="javascript"> 
     $.ajaxSetup ({ 
           cache: false //close AJAX cache 
      }); 
</script>

8、修改load 加載的url地址，如在url 多加個時間參數就可以：

function loadEventInfoPage(eventId){
    $.ajaxSetup ({ 
       cache: true // AJAX cache  下面加上時間后load的頁面中的js、css圖片等都會重新加載，   
         //加上這句action會重新加載，但是js、css、圖片等會走緩存 
    }); 
    $("#showEventInfo").load(ctx + "/custEvents/viewEvent.action",  {"complaint.Id":eventId, "tt":(new Date()).getTime()},function(){}) 
}

9、設置html的緩存

<META HTTP-EQUIV="Pragma" CONTENT="no-cache">    
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">    
<META HTTP-EQUIV="Expires" CONTENT="0">