英文原文地址

在Ajax 緩存: 兩個重要的事實文章中, 作者指出:

在IE中，即使你按強制刷新（Ctrl+F5），在內(nèi)容過期之前，Ajax也不會更新。確保更新的唯一方法是從緩存中刪除此記錄。

我發(fā)現(xiàn)這雖然很難讓人相信，但這確是事實。如果碰到刷新鍵（F5），IE瀏覽器將重新請求在網(wǎng)頁中的除XMLHttpRequest以外所有未過期的資源。在測試期間，這肯定會為開發(fā)造成混亂，但我想知道是否還有其他問題。其他主流瀏覽器的行為是什么？如果內(nèi)容已經(jīng)過期或者沒有Expires頭的行為是什么？增加Cache-Control: max-age 頭有什么效果？

因此我創(chuàng)建了這個Ajax 緩存測試頁面.

這個測試頁面包含了一個圖片，一個外部腳本文件和一個XMLHttpRequest。過期日期取決于我們選擇的鏈接。

• Expires in the Past 包含了一個已過期30天的Expires 響應(yīng)頭, 一個Cache-Control: max-age=0 響應(yīng)頭
• no Expires沒有返回任何Expires 或 Cache-Control 響應(yīng)頭
• Expires in the Future 包含一個在未來30天才過期的Expires 響應(yīng)頭, 一個Cache-Control :max-age=2592000 響應(yīng)頭.

測試很簡單: 點擊一下鏈接 (比如, Expires in the Past), 等待頁面加載完畢，然后按F5。表1展示了在主流瀏覽器下的測試結(jié)果。結(jié)果記錄了Ajax請求是否重新請求還是從緩存讀取，如果重新請求HTTP狀態(tài)碼是什么。

下面是我對按F5鍵的總結(jié):

• 所有瀏覽器均重新請求圖片和腳本。(這樣做是有道理的)
• 所有瀏覽器均重新請求ajax，如果已經(jīng)過期。 (這樣做是有道理的 - 瀏覽器已經(jīng)知道了緩存的Ajax已經(jīng)失效)
• 唯一不同的行為是當(dāng)Ajax沒有設(shè)置Expires緩存頭或緩存未到期時. 即使按Ctrl+F5，IE 7和8 均不重新請求Ajax，不管沒有Expires頭或沒有過期。 當(dāng)沒有Expires頭時，Opera 10 不重新請求Ajax 。(我沒有找到在Opera下強制刷新的功能)
• 所有情況下，Opera 10 和 Safari 4 重新請求favicon.ico(浪費)
• 所有情況下，Safari 4 均沒有發(fā)送If-Modified-Since頭，導(dǎo)致產(chǎn)生HTTP 200狀態(tài)碼，對于圖片和腳本也是一樣(這是浪費并且背離了其它瀏覽器的行為)

結(jié)論

下面是我對頁面開發(fā)人員和瀏覽器廠商的建議:

1. 開發(fā)人員需要設(shè)置一個已過期或未過期的Expires，避免出現(xiàn)未指定Expires時含混不清和怪異的行為
2. 如果Ajax不應(yīng)被緩存，開發(fā)人員應(yīng)該設(shè)置一個已過期的過期日期
3. 如果Ajax應(yīng)該被緩存，開發(fā)人員應(yīng)該設(shè)置一個未過期的過期日期。當(dāng)在IE 7和8下面測試時,開發(fā)人員應(yīng)該記得測試重新加載（F5）時清空緩存
4. 當(dāng)按F5時，IE 應(yīng)該重新請求Ajax
5. 當(dāng)按F5時，Opera 和 Safari 應(yīng)該不再加載favicon.ico
6. 當(dāng)按F5時，Safari應(yīng)該發(fā)送If-Modified-Since頭

• ajax