本文是Web前端性能優(yōu)化系列文章中的第五篇，主要講述內(nèi)容：配置ETag。完整教程可查看：Web前端性能優(yōu)化

什么是ETag？

實體標簽(EntityTag)是唯一標識了一個組件的一個特定版本的字符串，是web服務器用于確認緩存組件的有效性的一種機制，通�？梢允褂媒M件的某些屬性來構(gòu)造它。

條件GET請求

瀏覽器下載組件的時候，會將它們存儲到瀏覽器緩存中。如果需要再次獲取相同的組件，瀏覽器將檢查組件的緩存時間，假如已經(jīng)過期，那么瀏覽器將發(fā)送一個條件GET請求到服務器，服務器判斷緩存還有效，則發(fā)送一個304響應，告訴瀏覽器可以重用緩存組件。

那么服務器是根據(jù)什么判斷緩存是否還有效呢?答案有兩種方式，一種是前面提到的ETag，另一種是根據(jù)最新修改時間。先來看看最新修改時間。

最新修改時間

原始服務器通過Last-Modified響應頭來返回組件的最新修改時間。

以一個實際例子來說明，當我們不帶緩存訪問www.google.com.hk的時候，我們需要下載google的logo，這時會發(fā)送這樣一個HTTP請求：

Request：

GET /logo.png HTTP 1.1

Host: www.google.com.hk

Response:

HTTP 1.1 200 OK

Last-Modified:Wed, 09 Oct 2013 01:35:39 GMT

當需要再次訪問相同組件的時候，同時緩存已經(jīng)過期，瀏覽器會發(fā)送如下條件GET請求：

Request：

GET /logo.png HTTP 1.1

If-Modified-Since:Wed, 09 Oct 2013 01:35:39 GMT

Host: www.google.com.hk

Response:

HTTP 1.1 304 Not Modified

實體標簽

ETag提供了另外一種方式，用于檢測瀏覽器緩存中的組件與原始服務器上的組件是否匹配。摘抄自書上的例子：

不帶緩存的請求：

Request：

GET /i/yahoo/gif HTTP 1.1

Host: us.yimg.com

Response:

HTTP 1.1 200 OK

Last-Modified:Tue,12 Dec 200603:03:59 GMT

ETag:”10c24bc-4ab-457elc1f“

再次請求相同組件:

Request：

GET /i/yahoo/gif HTTP 1.1

Host: us.yimg.com

If-Modified-Since:Tue,12 Dec 200603:03:59 GMT

If-None-Match:”10c24bc-4ab-457elc1f“

Response:

HTTP 1.1 304 Not Midified

當ETag和Modified-Time都出現(xiàn)了，則原始服務器禁止返回304除非請求中的條件頭字段全部一致。

為什么要引入ETag?

ETag主要是為了解決Last-Modified無法解決的一些問題：

1. 一些文件也許會周期性的更改，但是他的內(nèi)容并不改變(僅僅改變的修改時間)，這個時候我們并不希望客戶端認為這個文件被修改了，而重新GET;

2. 某些文件修改非常頻繁，比如在秒以下的時間內(nèi)進行修改，(比方說1s內(nèi)修改了N次)，If-Modified-Since能檢查到的粒度是s級的，這種修改無法判斷(或者說UNIX記錄MTIME只能精確到秒);

3. 某些服務器不能精確的得到文件的最后修改時間。

ETag帶來的問題

ETag的問題在于通常使用某些屬性來構(gòu)造它，有些屬性對于特定的部署了網(wǎng)站的服務器來說是唯一的。當使用集群服務器的時候，瀏覽器從一臺服務器上獲取了原始組件，之后又向另外一臺不同的服務器發(fā)起條件GET請求，ETag就會出現(xiàn)不匹配的狀況。

最佳實踐

1. 如果使用Last-Modified不會出現(xiàn)任何問題，可以直接移除ETag，google的搜索首頁則沒有使用ETag。

2. 確定要使用ETag，在配置ETag的值的時候，移除可能影響到組件集群服務器驗證的屬性，例如只包含組件大小和時間戳。

完整教程可查看：Web前端性能優(yōu)化

標簽： Web前端性能優(yōu)化 Web前端性能優(yōu)化教程 Web優(yōu)化 

版權(quán)申明：本站文章部分自網(wǎng)絡，如有侵權(quán)，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請與原作者聯(lián)系。