HTTP之缓存 Cache-Control

更新日期: 2019-02-23 阅读: 3.1k 标签: 缓存

通过在Response Header设置Cache-Control head 信息可以控制浏览器的缓存行为。我们先来看一下Cache-Control可以设置哪些值:


一、可缓存性

public: http通信的过程中,包括请求的发起方(浏览器)、代理缓存服务器都可以进行缓存。

private :只允许请求的发起方(浏览器)进行缓存。

no-cache:可以在请求的发起方(浏览器)进行缓存,但是每次都需要去服务器进行资源验证。

no-store:任何地方都不可以缓存。


二、到期

max-age:<seconds> 表示缓存多少秒之后过期(浏览器和代理缓存服务器中都是),如果只设置了max-age,没有设置no-cache,浏览器在要请求相同的静态文件时,会看是否在max-age时间内,如果在的会就直接使用缓存中的值了,单独只设置max-age很可能会造成资源得不到及时的更新。

s-maxage:<seconds>表示代理缓存服务器中的静态资源多少秒之后过期,如果同时设置了max-age和s-maxage,在浏览器中,使用max-age进行判断,在代理缓存服务器中使用s-maxage进行判断。


三、重新验证

must-revalidate:缓存(浏览器和代理缓存服务器中都是)过期后必须去重新验证。

proxy-revalidate:代理缓存服务器中缓存过期后必须去验证。


浏览器发起请求时与缓存相关的步骤:


发起方发起请求后,先去本地缓存中查找,命中就返回给发起方,不命中的话就去代理缓存服务器中查找,命中就返回,不命中才会去源服务器查找。

 需要清楚的是,缓存头Cache-Control只能在服务端设置,在客户端是由浏览器设置的,自己不能修改它的值。


下面说明几种情况:

一、如果单独使用max-age,在缓存有效的时间内浏览器对相同的资源发起请求是得不到更新的、为了解决这个问题,可以在每次编译时给静态文件设置hash值,这样,在浏览器再次对静态资源发起请求时,资源的名称已经修改了,浏览器不会认为是同一资源,也就不会去缓存中寻找,直接去源服务器中获取。


二、如果设置了no-cache,在缓存有效的时间内,浏览器对相同的资源发起请求时,会先去服务器询问资源是否修改过,资源没有修改时,响应304 Not Modified,浏览器得到304响应后,判断缓存可以使用,就会直接使用缓存。如果资源更新过,就返回200,浏览器使用返回的资源。

当设置了no-cache时,需要有一种验证机制来判断资源是否更新过:

Last-Modified配合If-Modified-Since或者If-Unmodified-since使用:对比上次修改时间来验证是否使用缓存。步骤是:client第一次对资源发起请求时,server会设置Last-Modified的头信息,当浏览器再次对相同的资源发起请求时,浏览器会设置request的头部(chrome可以使用disable cache来禁止浏览器自动设置,这样每次都会去源服务器获取),设置If-Modified-Since或者If-Unmodified-since的值为之前接收到的Last-Modified的值,这样,server每次取得头部信息If-Modified-Since或者If-Unmodified-since,与文件的修改时间进行对比,如果相同,就返回304Not Modified,client使用缓存,如果不相同,就返回更新后的资源。

Etag 数字签名配合If-Match或者If-None-Match使用:一般的数字签名可以对资源的内容进行hash计算,client第一次请求资源时,在server中设置头部信息Etag,值为hash值,当浏览器再次对相同的资源发起请求时,浏览器会设置request的头部,设置If-Match或者If-None-Match的值为之前接收到的Etag的值,这样,server每次取得头部信息If-Match或者If-None-match,与重新计算的hash值进行对比,如果相同,就返回304Not Modified,client使用缓存,如果不相同,就返回更新后的资源。


本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!

链接: https://fly63.com/article/detial/2100

相关推荐

给url加时间戳,骗过浏览器缓存

修改js的时候总是因为浏览器不刷新缓存,导致修改无效。URL后面添加随机数通常用于防止客户端(浏览器)缓存页面。 浏览器缓存是基于url进行缓存的,如果页面允许缓存

Nginx禁止html等缓存

在本地开发的时候,经常会碰到缓存引起的莫名其妙的问题,最暴力的方式就是清掉浏览器的缓存,或者使用Ctrl + F5,Shift + F5强制刷新页面。 有时候按了好几下,缓存还是清不掉,只能暂时禁用浏览器静态资源缓存了

Node.js中的code cache

V8使用JIT去解析JS,在JS代码执行之前,首先要消耗大量的时间在解析和编译中,这会拖慢JS的总执行时间,在2015年V8支持了code cache方案来解决这个问题。

vue后台管理系统解决keep-alive页面路由参数变化时缓存问题

一个后台管理系统,一个列表页A路由配置需要缓存,另一个页面B里面有多个跳转到A路由的链接。问题描述:首先访问/A?id=1页面,然后到B页面再点击访问A?id=2的页面,发现由于页面A设置了缓存,数据还是id=1的数据,并没有更新。

解决vue,keep-alive不同路由同一个组件的缓存问题

当vue使用keep-alive缓存页面状态时,当不同路由指向同一个组件,如何分别缓存页面状态的问题。vue缓存时如果发现组件相同,则会认定为同一个。

前端静态资源自动化处理版本号防缓存

浏览器会默认缓存网站的静态资源文件,如:js文件、css文件、图片等。缓存带来网站性能提升的同时也带来了一些困扰,最常见的问题就是不能及时更新静态资源,造成新版本发布时用户无法及时看到新版本的变化,严重影响了用户体验。

浏览器缓存问题原理以及解决方案

浏览器缓存就是把一个已经请求过的Web资源(如html页面,图片,js,数据等)拷贝一份副本储存在浏览器中,为什么使用缓存:减少网络带宽消耗,降低服务器压力,减少网络延迟,加快页面打开速度

js清除浏览器缓存的方法

怎么清除浏览器缓存,比如每次进入页面后先清理上次浏览器缓存的html,css,js ? 直接在html页面的head标签中添加,当然这个需要浏览器支持, 不想缓存静态文件,

浏览器缓存_HTTP强缓存和协商缓存

浏览器缓存主要分为强强缓存(也称本地缓存)和协商缓存(也称弱缓存),强缓存是利用http头中的Expires和Cache-Control两个字段来控制的,用来表示资源的缓存时间。协商缓存就是由服务器来确定缓存资源是否可用.

抽离css以及公共js

分离css:为何要把 CSS 文件分离出来,而不是直接一起打包在 JS 中。当我们考虑更好地利用缓存来加速静态资源访问时,会尝试把一些公共资源单独分离开来,利用缓存加速,以避免重复的加载

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!