這兩個字段都和HTTP協(xié)議的緩存控制相關(guān)。

瀏覽器緩存機(jī)制是通過HTTP協(xié)議Header里的Cache-Control（或Expires）和Last-Modified（或 Etag）等字段來實(shí)現(xiàn),。

這兩個字段的作用：

1. 接收響應(yīng)時,，瀏覽器決定文件是否需要被緩存；

2. 需要加載文件時,，瀏覽器決定是否需要發(fā)出請求的字段,。

看一些例子：

Cache-Control:max-age=115360000，表示緩存有效期為115360000秒,。如果115360000秒內(nèi)需要再次請求這個文件,，瀏覽器不會發(fā)出向服務(wù)器發(fā)出請求，而是直接使用本地的緩存的文件,。這是HTTP/1.1標(biāo)準(zhǔn)中的字段,。

這總情況能在Chrome開發(fā)者工具的Network標(biāo)簽頁里看到from disk cache的提示：

從本地緩存中讀取文件非常快速,，上面的例子只花費(fèi)了6毫秒：

Expires: Thu, 31 Dec 2018 23:55:55 GMT,，表示該文件的過期時間是2018年12月31日晚上23點(diǎn)55分55秒，在這個時間之前瀏覽器都不會再次發(fā)出請求去獲取該文件,。這是HTTP/1.0中的字段,。

在Chrome開發(fā)者工具的network標(biāo)簽頁里能看到：

下面兩個字段是發(fā)起請求時，服務(wù)器決定文件是否需要更新的字段,。

Last-Modified: Thu, 26 Jul 2018 05:41:21 GMT,，這表示這個文件最后的修改時間是2018年7月26日5點(diǎn)41分21秒,。

瀏覽器會在下次請求的時候，把Last-Modified的值作為Request Header的If-Modified-Since字段帶上,。如果瀏覽器緩存的文件已經(jīng)超過了Cache-Control（或者Expires）,，那么需要加載這個文件時，就會發(fā)出請求,，請求的Header有一個字段為If-Modified-Since,，如下圖所示：

服務(wù)器接收到請求后，會把文件的Last-Modified時間和這個時間對比,，如果時間沒變,，那么瀏覽器將返回304 Not Modified給瀏覽器：

如果時間有變化，那么服務(wù)器會返回200 OK,，并返回相應(yīng)的內(nèi)容給瀏覽器,。

下圖第9行的get_header_field方法是服務(wù)器從瀏覽器發(fā)送過來的HTTP請求提取頭部字段If-Modified-Since的值。

下圖第16行的set_header_field方法是服務(wù)器設(shè)置Last-Modified頭部字段的值,。

下圖就是服務(wù)器設(shè)置304 Not Modified響應(yīng)的位置：

要獲取更多Jerry的原創(chuàng)技術(shù)文章,，請關(guān)注公眾號"汪子熙"