Web前端性能优化教程05:配置ETag

什么是ETag?

实体标签(EntityTag)是唯一标识了一个组件的一个特定版本的字符串,是web服务器用于确认缓存组件的有效性的一种机制,通常可以使用组件的某些属性来构造它。

条件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的值的时候,移除可能影响到组件集群服务器验证的属性,例如只包含组件大小和时间戳。

原文发布于微信公众号 - 我为Net狂(dotNetCrazy)

原文发表时间:2016-12-01

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏SpiritLing

Apache中限制和允许特定IP访问

Apache中限制和允许特定IP访问 <Directory "/var/www"> Options All AllowOverride None Order...

42670
来自专栏电光石火

Win7系统 IIS 调试ASP(aspcmsgbk25) 错误号:3706 提示 “未找到提供程序 该程序可能未正确安装”解决办法

有两种报错形式 一、错误号:3706  错误描述:未找到提供程序。该程序可能未正确安装。 二、“ADODB.Connection 错误 '800a0e7a'...

26590
来自专栏java一日一条

浅谈浏览器HTTP的缓存机制

针对浏览器的http缓存的分析也算是老生常谈了,每隔一段时间就会冒出一篇不错的文章,其原理也是各大公司面试时几乎必考的问题。

12620
来自专栏Jerry的SAP技术分享

HTTP 200 OK和HTTP 304 Not modified的由来

浏览器缓存机制是通过HTTP协议Header里的Cache-Control(或Expires)和Last-Modified(或 Etag)等字段来实现。

13620
来自专栏电光石火

简单的Ajax封装

/* *参数说明: *opts: {'可选参数'} **method: 请求方式:GET/POST,默认值:'GET'; **u...

27790
来自专栏IT技术精选文摘

浏览器缓存机制剖析

这是判断是否启用缓存的第一步。如果浏览器通过某些条件(条件之后再说)判断出来,ok现在这个缓存没有过期可以用,那么连请求都不会发的,直接是启用之前浏览器缓存下来...

17770
来自专栏前端技术总结

图解浏览器缓存

浏览器缓存,是浏览器端保存数据,用于快速读取或避免重复资源请求的优化机制,有效的缓存使用可以避免重复的网络请求和加快页面速度,从而提高用户体验。

2.5K430
来自专栏电光石火

Win7系统 IIS 调试ASP(aspcmsgbk25) 错误号:3706

一、错误号:3706  错误描述:未找到提供程序。该程序可能未正确安装。

24050
来自专栏Java学习123

连接池中的maxIdle,MaxActive,maxWait参数

39560
来自专栏IMWeb前端团队

HTTP缓存控制小结

引言 通过网络获取内容既缓慢,成本又高:大的响应需要在客户端和服务器之间进行多次往返通信,这拖延了浏览器可以使用和处理内容的时间,同时也增加了访问者的数据成本。...

30980

扫码关注云+社区

领取腾讯云代金券