浏览器缓存学习

浏览器端的缓存

浏览器端的缓存规则分别从新鲜度和校验值两个维度来规定浏览器是直接使用缓存副本，还是重新去源服务器获取最新版本。

新鲜度（过期机制）：也就是缓存副本有效期。 
一个缓存副本必须满足以下条件之一，浏览器会认为它是有效的，足够新的： 
1. 含有完整的过期时间控制头信息（HTTP协议报头），并且仍在有效期内； 
2. 浏览器已经使用过这个缓存副本，并且在一个会话中已经检查过新鲜度；

校验值（验证机制）：服务器返回资源的时候有时在控制头信息带上这个资源的实体标签Etag（Entity Tag），它可以用来作为浏览器再次请求过程的校验标识。如过发现校验标识不匹配，说明资源已经被修改或过期，浏览器需求重新获取资源内容。

 

使用缓存有关的HTTP消息报头

规则	消息报头	值/示例	类型	作用
新鲜度	Expires	Sun,16 Oct 2016 05:43:02 GMT	响应	告诉浏览器在过期时间前可以使用副本（有可能存在时间不一致问题）
	Pragma	no-cache	响应	告诉浏览器忽略资源的缓存副本（HTTP1.1 可用Cache-Control替换）
	Cache-Control	no-cache	响应	告诉浏览器忽略资源的缓存副本，强制每次请求直接发给源服务器
		no-store	响应	强制缓存在任何情况下都不保留任何副本
		max-age=[秒]	响应	指明缓存副本的有效时长，从请求时间开始到过期时间之前的秒数
		public	响应	任何途径的缓存者（本地缓存，代理服务器），可以无条件地缓存该资源
		private	响应	只针对单个用户或实体（不同用户，窗口）缓存资源
	Last-Modified	Sun,16 Oct 2016 05:43:02 GMT	响应	告诉浏览器当前资源的最后修改时间
	If-Modified-Since	Sun,16 Oct 2016 05:43:02 GMT	响应	如果浏览器第一次请求时响应中的 Last-Modified 非空，第二次请求同一资源时，就会把它作为该项的值发送给服务器
校验值	ETag	50b1c1d4f775c61:df3	响应	告知浏览器当前资源在服务器的唯一标识符（生成规则由服务器决定）
	If-None-Match	50b1c1d4f775c61:df3	请求	如果浏览器第一次请求时响应中ETag非空，第二次请求同一资源时，会把它作为该项的值发给服务器
辅助	Vary	Accept-Encoding	响应	辅助从多个缓存副本中筛选合适的版本（不同压缩算法产生的副本）

 

Expires与Cache-Control

Cache-Control与Expires的作用一致，都是指明当前资源的有效期，控制浏览器是直接从浏览器缓存取数据还是重新发请求到服务器取数据。只不过Cache-Control的选择更多，设置更细致，如果同时设置的话，Cache-Control的优先级高于Expires。

 

Last-Modified/ETag与Cache-Control/Expires

Last-Modified/ETag：浏览器再次访问统一URI的资源，还是会发送请求到服务器询问文件是否已经修改，如果没有，服务器会只发送一个304回给浏览器，告诉浏览器直接从自己本地的缓存取数据；如果修改过那就整个数据重新发给浏览器；

Cache-Control/Expires：如果检测到本地的缓存还是有效的时间范围内，浏览器直接使用本地副本，不会发送任何请求。

两者一起使用时，Cache-Control/Expires的优先级要高于Last-Modified/ETag。即当本地副本根据Cache-Control/Expires发现还在有效期内时，则不会再次发送请求去服务器询问修改时间（Last-Modified）或实体标识（Etag）了。

一般情况下，使用Cache-Control/Expires会配合Last-Modified/ETag一起使用，因为即使服务器设置缓存时间, 当用户点击“刷新”按钮时，浏览器会忽略缓存继续向服务器发送请求，这时Last-Modified/ETag将能够很好利用304，从而减少响应开销。

 

Last-Modified与ETag

HTTP1.1中Etag的出现主要是为了解决几个Last-Modified比较难解决的问题： 
1. Last-Modified标注的最后修改只能精确到秒级，如果某些文件在1秒钟以内，被修改多次的话，它将不能准确标注文件的新鲜度 
2. 如果某些文件会被定期生成，当有时内容并没有任何变化，但Last-Modified却改变了，导致文件没法使用缓存 
3. 有可能存在服务器没有准确获取文件修改时间，或者与代理服务器时间不一致等情形

 

用户行为与缓存

 

用户操作	Cache-Control/Expires	Last-Modified/ETag
地址栏回车	有效	有效
页面链接跳转	有效	有效
新开窗口	有效	有效
前进后退	有效	有效
F5刷新	无效	有效
Ctrl+F5强制刷新	无效	无效