持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第30天,点击查看活动详情
前言
大家好呀,我是L同学。在上篇文章http缓存控制中,我们学习了http缓存控制相关知识点,包括为什么需要缓存等相关知识点。今天,在这篇文章中,我们将学习强缓存、Expires、Cache-Control等相关知识点。
强缓存
命中强缓存时,浏览器并不会将请求发送给服务器。在Chrome的开发者工具中看到http的返回码是200,但是在Size列会显示为(from cache)。
强缓存是利用http的返回的响应头中的Expires或者Cache-Control(优先级更高)两个字段来控制的,用来表示资源的缓存时间。
Expires:指定一个具体时间(2020年12月12日17:00),到了这个时间了,缓存过期了,在时间内,都是有效的,可以直接读。
Cache-Control:指定一个过期时间(3600s),这个资源你加载到后,可以用3600s。
Expires
缓存过期时间,用来指定资源到期的时间,是服务器端的具体的时间点。Expires是Wb服务器响应消息头字段,在响应http请求时告诉浏览器在过期时间前浏览器可以直接从浏览器缓存取数据,而无需再次请求。该字段会返回一个时间,比如Expires:Wed,23Nov205016:00:01GMT。这个时间代表着这个资源的失效时间,也就是说在xx年x月xx日时间之前都是有效的,即命中缓存。
这种方式有一个明显的缺点,由于失效时间是一个绝对时间,所以当服务器与客户端时间偏差很大以后,就会导致缓存混乱。于是发展出了Cache-Control。
Cache-Control
Cache-Control是一个相对时间,例如Cache-Control:max-age3600,代表着资源的有效期是3600秒。由于是相对时间,并且都是与客户端时间比较,所以服务器与客户端时间偏差也不会导致问题。
Cache-Control与Expires可以在服务端配置同时启用或者启用任意一个,同时启用的时候Cache-Controlt优先级高。Cache-Control可以由多个字段组合而成,主要有以下几个取值:
1.max-age指定一个时间长度,在这个时间段内缓存是有效的,单位是s。例如设置Cache-Control:max-age=31536000,也就是说缓存有效期为(31536000/24/60/60)天,第一次访问这个资源的时候,服务器端也返回了Expires字段,并且过期时间是一年后。
2.no-cache强制所有缓存了该响应的用户,在使用已缓存的数据前,发送带验证器的请求到服务器。不是字面意思上的不缓存。
3.no-store禁止缓存,每次请求都要向服务器重新获取数据。
强缓存这种缓存处理,推荐给静态资源,不太会变化的资源处理。