浏览器缓存控制

浏览器缓存控制

Last-Modified/ If-Modified-Since

在浏览器第一次请求某一个URL时,服务器端的返回状态码200,内容是客户端请求的资源,同时有一个Last-Modified的属性标记此文件在服务器端最后被修改的时间。

Last-Modified格式类似这样:Last-Modified : Fri , 12 May 2006 18:53:33 GMT

客户端第二次请求此URL时,根据HTTP协议的规定,浏览器会向服务器传送If-Modified-Since报头,询问该时间之后文件是否有被修改过:

If-Modified-Since : Fri , 12 May 2006 18:53:33 GMT

如果服务器端的资源没有变化,则自动返回 HTTP 304(Not Changed.)状态码,内容为空,这样就节省了传输数据量。当服务器端代码发生改变或者重启服务器时,则重新发出资源,返回和第一次请求类似。从而保证不向客户端重复发出资源,也保证当服务器有变化时,客户端能够得到最新的资源。

Last-Modified的问题

1、一些文件会被编辑,但内容并未改变,这个时候不希望客户端认为这个文件被修改了,而重新获取资源。

2、某些文件修改非常频繁,比如在秒以下的时间内进行修改,If-Modified-Since无法检查到。

3、某些服务器不能精确的得到文件的最后修改时间。

Expires

Expires用来控制缓存失效的日期。当浏览器看到响应中有一个Expires头时,它会和相应的组件一起保存到其缓存中,只要组件没有过期,浏览器就会使用缓存版本而不会进行任何的HTTP请求。长久的Expires头适用于图片等不经常更新的资源。Expires设置的日期格式必须为GMT(格林尼治标准时间)。

Expires:Wed, 11 Jan 2017 08:10:26 GMT

Expires的不足:

首先,Expires头使用的是一个特定的时间,要求客户端和服务器端的时钟严格同步。如果服务器和客户端的时间不统一,这有可能出现缓存提前失效的情况,存在不稳定性。其次,假如Expires的日期到来,需要在服务器配置中再提供一个新的日期。

Cache-Control

HTTP1.1引入了Cache-Control头来克服Expires头的不足。Cache-Control使用max-age制定组件被缓存多久,以秒为单位。例如

Cache-Control:max-age=3600表示组件将被缓存60分钟。

如果max-age和Expires同时出现,则max-age有更高的优先级,浏览器会根据max-age的时间来确认缓存过期时间。


常用 cache-directive 


Cache-directive


说明


public


所有内容都将被缓存(客户端和代理服务器都可缓存)


private


内容只缓存到私有缓存中(仅客户端可以缓存,代理服务器不可缓存),默认值


no-cache


必须先与服务器确认返回的响应是否被更改,然后才能使用该响应来满足后续对同一个网址的请求。因此,如果存在合适的验证令牌 (ETag),no-cache 会发起往返通信来验证缓存的响应,如果资源未被更改,可以避免下载。


no-store


所有内容都不会被缓存到缓存或 Internet 临时文件中


must-revalidation/proxy-revalidation


如果缓存的内容失效,请求必须发送到服务器/代理以进行重新验证


max-age=xxx (xxx is numeric)


缓存的内容将在 xxx 秒后失效, 这个选项只在HTTP 1.1可用。如果和Last-Modified一起使用时, 优先级较高


浏览器的不同操作


打开新窗口


如果指定cache-control的值为private、no-cache、must-revalidate,那么打开新窗口访问时都会重新访问服务器。而如果指定了max-age值,那么在此值内的时间里就不会重新访问服务器,例如:Cache-control: max-age=5 表示当访问此网页后的5秒内不会去再次访问服务器.


在地址栏回车


如果值为private或must-revalidate,则只有第一次访问时会访问服务器,以后就不再访问。如果值为no-cache,那么每次都会访问。如果值为max-age,则在过期之前不会重复访问。


按后退按扭


如果值为private、must-revalidate、max-age,则不会重访问,而如果为no-cache,则每次都重复访问.


按刷新按扭


无论为何值,都会重复访问.

 

Etag(Entity Tag)

服务器在检测缓存的组件是否和原始服务器上的组件匹配时有两种方法:

(1)比较最近修改日期;Last-Modified/If-Modified-since

(1)比较实体标签;Etag/If-None-Match(优先级比If-Modified-since高)

实体标签,是web服务器和浏览器用于确认缓存组件的有效性的一种机制。

ETag:"50b1c1d4f775c61:df3"

第一次请求时:

1.客户端发起HTTP GET 请求一个资源;

2.服务器处理请求,返回资源,包括Http Etag和状态码200

第二次请求时:

1.客户端发起 HTTP GET 请求一个文件,请求中包括一个If-None-Match头,内容就是第一次请求时服务器返回的Etag的值

2.服务器判断接受到的Etag和计算出来的Etag是否匹配。若匹配,返回304状态码,客户端继续使用本地的缓存。若不匹配,返回资源和新的ETag。

ETag带来的问题

ETag通常使用组件的某些属性来构造它,这些属性对于特定的寄宿了网站服务器来说是唯一的。当浏览器从一台服务器上获取了原始组件,之后又向另外一台不同的服务器发起条件GET请求时,ETag是不会匹配的。

对组件进行不必要的重新加载还会影响服务器的性能并增加带宽开销。如果你的RoundRobin Rotation集群中有n台服务器,下一次用户缓存中的Etag能和服务器匹配的概率是1/n。Etag还会降低代理缓存的效率,因为代理的与自身的不匹配会重新下载。

HTTP响应优化

移除ETag,Expires,使用Cache-Control控制本地缓存。

时间: 02-20

浏览器缓存控制的相关文章

前端性能优化成神之路-浏览器缓存机制详解

对一个网站而言,CSS.javascript.logo.图标这些静态资源文件更新的频率都比较低,而这些文件又几乎是每次http请求都需要的,如果将这些文件缓存在浏览器中,可以极好的改善性能. 通过设置http头中的cache-control和expires的属性和HTML Meta标签,可设定浏览器缓存,缓存时间可以是数天,甚至是几个月. 浏览器缓存控制机制有两种:HTML Meta标签 vs. HTTP头信息(主要) HTML Meta 标签定义的缓存机制 可以在HTML页面的<head>节

浏览器的缓存控制

浏览器第一次向服务器请求资源时,服务器会发送完整的文件,并且在发送文件时还附带一些额外信息--比如过期时间:Expires:Mon,10 Dec 1999  02:25:22GMT.浏览器可以把这个额外信息保存在本地(缓存). 浏览器在请求已经访问过的URL时,会判断是否使用缓存,而浏览器的缓存控制分为强缓存和协商缓存:协商缓存必须配合强缓存使用. 浏览器的第一次缓存: 首先浏览器第一次跟服务器请求一个资源,服务器在返回这个资源和response header的同时,会根据开发者要求或者浏览器默

servletResponse 控制浏览器缓存

//当访问一些资源文件时,我们希望,访问一次后,资源文件能够在缓存在浏览器中,当我们再次访问该资源时 //直接从缓存中去取,这样可以减少服务器的压力 package response; import java.io.IOException;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import ja

HTTP协议控制浏览器缓存HTTP协议控制浏览器缓存

HTTP协议控制浏览器缓存 2015.01.25 SilenceHurts 当我们浏览网站的图片时,按下F12监控,很容易就发现,当我们第一次浏览该图片时,浏览器返回的代码是200,即请求正常,此时,不懂任何东西,我们按下F5刷新页面,注意,我们会发现监控下的代码返回不再是200,而是现实304 Not Modifid,即未修改. 原因:第一次我们访问图片时,是正常的,而第二次访问时现实304,因为此时我们浏览器发现页面未发生更改,此时使用的是本地的缓存,而并非服务器返回的代码,加快了速度. 设

分享一个控制JS 浏览器缓存的解决办法。

 JS 缓存的问题一直都是我们又爱又恨的东西.也是我们比较头痛的问题, 一方面为了提高网站响应速度,减少服务器的负担,和节省带宽,将需要将静态资源缓存在客户端, 但是另一方面,当js 文件有改动的时候,如何快速的将客户端缓存的js文件都失效,这是非常头痛的问题. 以至于每次客户反馈问题的时候,我们第一个解决办法都是清理浏览器缓存. 那么如何解决呢. 1. 直接禁止全部的静态文件缓存 在html 头部加上如下代码: <META HTTP-EQUIV="pragma" CONTENT

服务器与浏览器缓存协商控制机制的总结

http://www.ginano.net/browser-server-cache-control-rule 发表于2013 年 3 月 13 日由ginano 引子:昨天中文站出现了大量的用户投诉,投诉内容是运费发生变化,运费金额不正确.可是我们本地怎么测试都没有问题.但是考虑到问题唯一的可能是昨天的一个关于运费模版优化的项目引发的.因为,我昨天中午发布了一个style应用版本,发布时间是11点20分左右,运费模版优化项目的发布是在晚上9点钟左右.但是由于运费模版优化项目在正式发布阶段发现了

浏览器缓存机制浅析

非HTTP协议定义的缓存机制 浏览器缓存机制,其实主要就是HTTP协议定义的缓存机制(如: Expires: Cache-control等).但是也有非HTTP协议定义的缓存机制,如使用HTML Meta 标签,Web开发者可以在HTML页面的<head>节点中加入<meta>标签,代码如下: <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 上述代码的作用是告诉浏览器当前页面不被缓存,每

HTTP缓存控制总结

引言 通过网络获取内容既缓慢,成本又高.大的相应需要在客户端和服务器之间多次往返通信,这拖延了浏览器可以使用和处理内容的时间,同时也增加了通信的成本.因此,缓存和重用以前获取到的资源的能力成为性能优化的一个很关键的方面. 与缓存相关的HTTP首部字段主要有哪些 (1)通用首部字段(意味着既能用于请求报文,又能用于响应报文) 字段名称 说明 Cache-Control 控制缓存的行为 Pragma http1.0的遗留物,值为"no-cache"时禁用缓存 (2)请求首部字段 (3)响应

HTTP缓存控制小结

引言 通过网络获取内容既缓慢,成本又高:大的响应需要在客户端和服务器之间进行多次往返通信,这拖延了浏览器可以使用和处理内容的时间,同时也增加了访问者的数据成本.因此,缓存和重用以前获取的资源的能力成为优化性能很关键的一个方面. 序 本文用于解决以下六个疑问. 与缓存相关的HTTP首部字段主要 有哪些 ? 这些HTTP首部字段之间的 联系与区别 ? HTTP缓存首部字段的 优先级 ? HTTP缓存首部字段的 特点与局限性 ? 用户 不同的页面刷新行为的差别 ? 在 实践中 我们该用哪些报文头来 控