AJAX緩存問題

        Ajax頁面緩存是ajax處理數據時對一些重復相同數據進行一個緩存操作，這種設計使客戶端對一些靜態頁面內容的請求，比如圖片，css文件，js腳本等，變得更加快捷，提高了頁面的響應速度，也節省了網絡通信資源。

 

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

        緩存問題主要是在IE下的GET請求方式。

        禁止頁面緩存問題：

          1. url參數添加隨機數或時間戳  

               該方式會在客戶端產生大量緩存文件。

//隨機數
var url = 'demo.php?username=' + username + '&_=' + Math.random(); 

//時間戳
var url = 'demo.php?username=' + username + '&_=' + new Date().getTime();

 

          2. 修改文件最后更改時間  If-Modified-Since

                       setRequestHeader("If-Modified-Since","0");

                  這樣和服務器上文件的最后修改時間肯定不一樣，所以不會訪問緩存文件,而是會重新訪問服務器.

                  這種方式只會在客戶端上產生一個緩存文件；

var xhr = createXhr();                            //創建對象
xhr.open('get' , url);                            //初始化對象
xhr.setRequestHeader('If-Modified-Since', '0');   //主動修改文件最后更改
//...

 

        3. 禁用緩存

                  客戶端設置： 在ajax發送請求前加上 xmlHttpRequest.setRequestHeader(“Cache-Control”,”no-cache”);

                  服務器端設置：在服務端加  header(“Cache-Control: no-cache, must-revalidate”);