<div id="jcozz"></div>
<ins id="jcozz"><nav id="jcozz"></nav></ins>

<progress id="jcozz"></progress>

<dl id="jcozz"><s id="jcozz"></s></dl>

<button id="jcozz"></button><li id="jcozz"></li>

    SEO愛站網 logo SEO愛站網

    怎樣推廣網站:Web前端性能優化教程08:配置ETag

    高階白帽玩法 68 0 2019-09-16 10:25:33

    本文是Web前端性能優化系列文章中的第五篇,主要講述內容:配置ETag。完整教程可查看:Web前端性能優化

    什么是ETag?

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

    條件GET請求

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

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

    最新修改時間

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

    以一個實際例子來說明,當我們不帶緩存訪問www.google.com.hk的時候,我們需要下載google的logo,這時會發送這樣一個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

    當需要再次訪問相同組件的時候,同時緩存已經過期,瀏覽器會發送如下條件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都出現了,則原始服務器禁止返回304除非請求中的條件頭字段全部一致。

    為什么要引入ETag?

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

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

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

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

    ETag帶來的問題

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

    最佳實踐

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

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

    完整教程可查看:Web前端性能優化

    轉載請注明:SEO愛站網 ? 怎樣推廣網站:Web前端性能優化教程08:配置ETag

    網友跟帖
    展開
    一道本无吗dⅤd更新