Skip to content

前端浏览器缓存在html配置

HTML 缓存配置格式

HTML文件通过标签的 http-equiv 属性来配置HTML文件的 http 响应头

如:

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

Cache-Control

Cache-Control 被用于在 http 请求和响应中,通过指定指令来实现缓存机制。

缓存指令是单向的,这意味着在请求头中设置的指令,不一定被包含在响应头中。

请求时的缓存指令:

max-age=<seconds>
max-stale[=<seconds>]
min-fresh=<seconds>
no-cache
no-store
no-transform
only-if-cached

响应消息中的指令:

must-revalidate
no-cache
no-store
no-transform
public
private
proxy-revalidate
max-age=<seconds>
s-maxage=<seconds>

各个消息中的指令含义如下:

Public

响应可以被任何对象缓存。如:发送请求的客户端,代理服务器等等。

Private

表明响应只能被单个用户缓存,不能作为共享缓存(即代理服务器不能缓存它)。私有缓存可以缓存响应内容,比如:对应用户的本地浏览器。

no-cache

指示请求或响应消息不能缓存。在发布缓存副本之前,强制要求缓存把请求提交给原始服务器进行验证(协商缓存验证)。

no-store

用于防止重要的信息被无意的发布。在请求消息中发送将使得请求和响应消息都不使用缓存。缓存不应存储有关客户端请求或服务器响应的任何内容,即不使用任何缓存。

max-age

设置缓存存储的最大周期,相对于请求时间,超过这个时间缓存被认为过期(单位秒)。

s-maxage

覆盖max-age或者Expires头,但是仅适用于共享缓存(比如各个代理),私有缓存会忽略它。

max-stale

表明客户端愿意接收一个已经过期的资源。可以设置一个可选的秒数,表示响应不能已经过时超过该给定的时间。

指示客户机可以接收超出超时期间的响应消息。如果指定max-stale消息的值,那么客户机可以接收超出超时期指定值之内的响应消息。

min-fresh

表示客户端希望获取一个能在指定的秒数内保持其最新状态的响应。

指示客户机可以接收响应时间小于当前时间加上指定时间的响应。

Pragma

建议只在需要兼容 HTTP/1.0 客户端的场合下应用 Pragma 首部。

HTTP/1.1 中如果没有 Cache-Control,Pragma: no-cache 与 Cache-Control: no-cache 一致,但是不建议。

<meta http-equiv="pragma" content="no-cache">

默认为private。

其作用根据不同的重新浏览方式分为以下几种情况:

1. 打开新窗口

值为private、no-cache、must-revalidate,那么打开新窗口访问时都会重新访问服务器。 而如果指定了max-age值,那么在此值内的时间里就不会重新访问服务器,例如:

Cache-control: max-age=5

表示当访问此网页后的5秒内再次访问不会去服务器)

2. 在地址栏回车

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

3. 按后退按扭

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

4. 按刷新按扭 无论为何值,都会重复访问

Cache-control值为“no-cache”时,访问此页面不会在Internet临时文件夹留下页面备份。

Expires

<meta http-equiv="expires" content="0">

Expires 响应头包含日期/时间,即在此时候之后,响应过期。

0 代表着过去的日期,即该资源已经过期。

如果 Cache-Control 设置了 max-age 或者 s-max-age,Expires 会被忽略。

领支付宝红包:打开支付宝搜索 726845401

领饿了么红包:0fυィ直文本 e:/$XGzEgR8$~.👉饿了么App👈【快來領外賣紅包,最高20元,人人都有哦~】

 

您的赞助将会鼓励作者技术文章创作以及支持本站运维。

发表评论

Your email is never published nor shared. Required fields are marked *


TOP