我們可以在HTML頁面利用meta tag和PHP程式中通過header來控制.例如:
代碼如下
header('Cache-Control:max-age=86400, must-revalidate');//24小時
header('Last-Modified:'.gmdate('D, d M Y H:i:s').'GMT');
header('Expires:'.gmdate('D, d M Y H:i:s', time() + '86400').'GMT');
echo '我不重新整理';再寫個HTML檔案c.htm:
haha,go
我們請求127.1/c.htm,點選連結,然後利用瀏覽器的回退按鈕,返回c.htm,再點選連結,如下圖左所示,我們發現,當添加了緩衝指令後,我們無論如何來回後退和點選連結,下面的網路請求URL這一條始終為灰色,表示瀏覽器並沒有發起實際的網路請求,而是直接調用了儲存在使用者電腦中的快取頁面,除非緩衝時間到期,在這期間,即使是實際內容改變了,瀏覽器也不會去重新讀取我們在伺服器上的資源。你可以把echo的那一句修改後,再點擊,會發現網路請求仍然為灰色。在這種情況下,只有以下三種情況瀏覽器才會去更新緩衝:
(1)緩衝到期
(2)緩衝被清除;
(3)F5或 ctrl+F5強制重新整理。(這一點各種瀏覽器處理可能存在差異,我的測試環境是firefox 4)
當我們屏蔽上面的header指令或者改用如下代碼時//告訴用戶端瀏覽器不使用緩衝,HTTP 1.1 協議
代碼如下
header("Cache-Control: no-cache, must-revalidate");
//告訴用戶端瀏覽器不使用緩衝,相容HTTP 1.0 協議
代碼如下
header("Pragma: no-cache");
瀏覽器就會在每次請求時都去伺服器上讀取資源。如下面右邊的圖所示。 在這裡,我們可以大致瞭解下瀏覽器對頁面的緩衝處理。很容易,我們就能聯想出其使用情境,有時候我們需要它緩衝,有時候又不需要,你可以根據情境來使用。不過,瀏覽器的緩衝作用是很微小的,但能省一點算一點。有時候,瀏覽器的緩衝是很厲害的,需要我們強制重新整理才能見效,比如JS檔案,有時你更改了,即使重新整理也是不會更改的。另,除了可以在代碼中設定頁面緩衝,也可以在APACHE等伺服器上配置,特別是靜態資源,加上緩衝可以有效減少不必要的請求。
又有時,我們通常會看到這樣的代碼,在JS檔案後加上問號的那一串並沒有實際意義,只是為了避免JS被緩衝,給JS檔案加一個版本號碼,通常用時間戳記做標記。這樣瀏覽器就不會緩衝我們的JS檔案了。
既然前端頁面緩衝的目的是為了減少請求,那我馬上想到了另一個思路,那就是壓縮資料。通過使用一些工具,可以對CSS和JS代碼進行壓縮。比如jquery的使用版就是經過壓縮的,往往這個壓縮比例還很大。通常使用jsmin,jspacker進行壓縮,具體工具可以到網上搜尋下.