資訊專欄INFORMATION COLUMN
摘要：所以，如何確定這些資源沒有發(fā)生變更如何控制緩存過期的時間成了必須解決的問題。瀏覽器接收到響應(yīng)后，會記錄這些信息，方便之后的緩存控制。也就是說，就算服務(wù)器端該資源已經(jīng)發(fā)生變化，只要緩存未過期，就不會重新請求資源，所以刷新的作用就體現(xiàn)出來了。
前幾天按照Node.js中文社區(qū)上的教程，用Node.js搭了一個簡單的靜態(tài)文件服務(wù)器，其中有一個功能是提供緩存支持，在實(shí)踐這一部分的過程中，我重新學(xué)習(xí)了緩存的相關(guān)知識，在這里作簡單的梳理。
關(guān)于緩存的相關(guān)介紹，網(wǎng)上有不少文章，這里推薦三篇我認(rèn)為不錯的文章：
http://blog.csdn.net/eroswang/article/details/8302191
http://www.oschina.net/news/41397/web-cache-knowledge
http://cloudbbs.org/forum.php?mod=viewthread&tid=15790
緩存是什么，簡單的說，就是訪問頁面時不需要重新請求瀏覽器已經(jīng)緩存的資源（如圖片、css、js等)，前提是這些位于服務(wù)器的資源并沒有發(fā)生變更。所以，如何確定這些資源沒有發(fā)生變更、如何控制緩存過期的時間成了必須解決的問題。這些內(nèi)容在以上三篇文章中都有詳細(xì)的介紹，我這里僅從四種使用情景來分析瀏覽器和服務(wù)器的交互過程。
情景一：用戶第一次在瀏覽器中輸入網(wǎng)址，或者通過鏈接訪問某個網(wǎng)站
瀏覽器（客戶端）發(fā)出請求，請求網(wǎng)頁上的所有資源，一個資源對應(yīng)一個請求，服務(wù)器端收到請求后，向客戶端發(fā)送200的狀態(tài)碼，表示該資源請求成功，并返回響應(yīng)頭（response header）和數(shù)據(jù)體。其中，響應(yīng)頭包含了以下幾個重要的頭信息：
last-modified：該資源（文件）的最后修改時間，為UTC格式
Expires：該資源的緩存過期時間，為絕對時間，即過了這個指定時間后緩存失效，為UTC格式
Cache-Control：通常通過max-age指定緩存過期時間，為相對時間，表示某次請求成功后多少秒內(nèi)緩存可用，單位為秒
Cache-Control的出現(xiàn)是因?yàn)榉?wù)器端的時間可能存在誤差，其優(yōu)先級高于Expires。瀏覽器接收到響應(yīng)后，會記錄這些信息，方便之后的緩存控制。
情景二：用戶第N次（N大于1）在瀏覽器中輸入網(wǎng)址，或者通過鏈接訪問某個網(wǎng)站
瀏覽器首先檢查待請求的資源的狀態(tài)，先檢查Cache-Control，沒有則檢查Expires，如果緩存未過期，則瀏覽器不向服務(wù)器端發(fā)送請求，直接返回200 from cache，表明是從緩存中獲取的資源。也就是說，就算服務(wù)器端該資源已經(jīng)發(fā)生變化，只要緩存未過期，就不會重新請求資源，所以刷新的作用就體現(xiàn)出來了。
情景三：資源已經(jīng)緩存，用戶刷新頁面（按F5）
瀏覽器向服務(wù)器發(fā)送資源請求，請求頭中包含以下兩個頭信息：
Cache-Control：其中max-age=0（刷新時置為0），表示本地緩存已過期，要向服務(wù)器確認(rèn)
if-modified-since：這是時間等于上一次成功請求該資源后從last-modified獲取的時間，為UTC格式
服務(wù)器接收到請求，將待請求資源的最后一次修改時間和if-modified-since進(jìn)行對比。如果前者與后者不相等，則說明文件已經(jīng)變動，則重新下載該資源，并返回200狀態(tài)碼；如果前者與后者相等，則從本地緩存中獲取，并返回304 Not Modified。
情景四：資源已經(jīng)緩存，用戶強(qiáng)制刷新頁面（按Ctrl + F5）
強(qiáng)制刷新時，請求頭中的Cache-Control的值設(shè)為no-cache，表示強(qiáng)制發(fā)送請求，此外請求頭中無If-Modified-Since頭信息，這樣，無論緩存是否過期，無論服務(wù)器端文件是否發(fā)生變更，都會強(qiáng)制下載請求的資源，這就是所謂的“強(qiáng)制刷新”。
最后，附上用node.js實(shí)現(xiàn)靜態(tài)文件服務(wù)器的教程：
用NodeJS打造你的靜態(tài)文件服務(wù)器
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/61758.html
摘要：演員表角色名稱扮演者小劉瀏覽器小李普通用戶小川傳輸層快遞小哥小汪網(wǎng)絡(luò)層老四目標(biāo)服務(wù)器比特大叔電流 ??小劉（瀏覽器）是一個批發(fā)商， 小李（普通用戶）是一個超市的進(jìn)貨經(jīng)理，一天小李經(jīng)理來到了小劉老板的店鋪，說：我‘要（www.baidu.com）類的所有東西’，小劉老板說：‘我得用我們的行話（IP）告訴底下的人你要的東西他才知道你要啥’，小劉老板從身上掏出一個本本（瀏覽器緩存的DNS），...
摘要：為何不設(shè)置頭的時候默認(rèn)輸出如下的緩存頭呢答案來自這是用于嘗試禁用瀏覽器緩存請求的這個日期是這個塊代碼開發(fā)者的生日那么問題來了把個人的事情帶到項(xiàng)目中來真的好嗎以后看到就可以認(rèn)為這程序是寫的啦有意思的是也是有這頭的 為何PHP不設(shè)置Expires頭的時候, 默認(rèn)輸出如下的緩存頭呢？: Expires: Thu, 19 Nov 1981 08:52:00 GMT 答案來自stac...
閱讀 4243·2021-09-27 14:02
閱讀 1939·2019-08-30 15:56
閱讀 1883·2019-08-29 18:44
閱讀 3426·2019-08-29 17:21
閱讀 618·2019-08-26 17:15
閱讀 1306·2019-08-26 13:57
閱讀 1394·2019-08-26 13:56
閱讀 3033·2019-08-26 11:30
