`

浏览器缓存机制

阅读更多

 

 


Cache-Control

 

Cache-Control 是最重要的规则。这个字段用于指定所有缓存机制在整个请求/响应链中必须服从的指令。这些指令指定用于阻止缓存对请求或响应造成不利干扰的行为。这些指令通常覆盖默认缓存算法。缓存指令是单向的,即请求中存在一个指令并不意味着响应中将存在同一个指令。

cache-control 定义是:Cache-Control = “Cache-Control” “:” cache-directive。表 1 展示了适用的值。

 

表 1. 常用 cache-directive 值 Cache-directive 说明
public 所有内容都将被缓存
private 内容只缓存到私有缓存中
no-cache 所有内容都不会被缓存
no-store 所有内容都不会被缓存到缓存或 Internet 临时文件中
must-revalidation/proxy-revalidation 如果缓存的内容失效,请求必须发送到服务器/代理以进行重新验证
max-age=xxx (xxx is numeric) 缓存的内容将在 xxx 秒后失效, 这个选项只在HTTP 1.1可用, 并如果和Last-Modified一起使用时, 优先级较高

表 2 表明在不同的情形下,浏览器是将请求重新发送到服务器还是使用缓存的内容。

表 2. 对 cache-directive 值的浏览器响应 Cache-directive 打开一个新的浏览器窗口 在原窗口中单击 Enter 按钮 刷新 单击 Back 按钮
public 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器重新发送请求到服务器 浏览器呈现来自缓存的页面
private 浏览器重新发送请求到服务器 第一次,浏览器重新发送请求到服务器;此后,浏览器呈现来自缓存的页面 浏览器重新发送请求到服务器 浏览器呈现来自缓存的页面
no-cache/no-store 浏览器重新发送请求到服务器 浏览器重新发送请求到服务器 浏览器重新发送请求到服务器 浏览器重新发送请求到服务器
must-revalidation/proxy-revalidation 浏览器重新发送请求到服务器 第一次,浏览器重新发送请求到服务器;此后,浏览器呈现来自缓存的页面 浏览器重新发送请求到服务器 浏览器呈现来自缓存的页面
max-age=xxx (xxx is numeric) 在 xxx 秒后,浏览器重新发送请求到服务器 在 xxx 秒后,浏览器重新发送请求到服务器 浏览器重新发送请求到服务器 在 xxx 秒后,浏览器重新发送请求到服务器

Cache-Control是关于浏览器缓存的最重要的设置,因为它覆盖其他设置,比如 Expires 和 Last-Modified。另外,由于浏览器的行为基本相同,这个属性是处理跨浏览器缓存问题的最有效的方法。

失效

Expires 头部字段提供一个日期和时间,响应在该日期和时间后被认为失效。失效的缓存条目通常不会被缓存(无论是代理缓存还是用户代理缓存)返回,除非首先通过原始服务器(或者拥有该实体的最新副本的中介缓存)验证。(注意:cache-control max-age 和 s-maxage 将覆盖 Expires 头部。)

Expires 字段接收以下格式的值:“Expires: Sun, 08 Nov 2009 03:37:26 GMT”。如果查看内容时的日期在给定的日期之前,则认为该内容没有失效并从缓存中提取出来。反之,则认为该内容失效,缓存将采取一些措施。表 3-6 表明针对不同用户操作的不同浏览器的行为。

表 3. 当用户打开一个新的浏览器窗口时的失效操作   Firefox 3.5 IE 8 Chrome 3 Safari 4
内容没有失效 浏览器呈现来自缓存的页面 浏览器重新发送请求到服务器。返回代码是 200 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面
内容失效 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200
表 4. 当用户在原始浏览器窗口中单击 Enter 按钮时的失效操作   Firefox 3.5 IE 8 Chrome 3 Safari 4
内容没有失效 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器重新发送请求到服务器。返回代码是 304 浏览器重新发送请求到服务器。返回代码是 304
内容失效 浏览器重新发送请求到服务器。返回代码是 200 浏览器呈现来自缓存的页面 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200
表 5. 当用户按 F5 键刷新页面时的失效操作   Firefox 3.5 IE 8 Chrome 3 Safari 4
内容没有失效 浏览器重新发送请求到服务器。返回代码是 304 浏览器重新发送请求到服务器。返回代码是 304 浏览器重新发送请求到服务器。返回代码是 304 浏览器重新发送请求到服务器。返回代码是 304
内容失效 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200
表 6. 当用户单击 Back 或 Forward 按钮时的失效操作   Firefox 3.5 IE 8 Chrome 3 Safari 4
内容没有失效 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面
内容失效 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器重新发送请求到服务器。返回代码是 200

注意:所有浏览器都假定为使用默认设置运行。

Last-Modified/E-Tag

Last-Modified 实体头部字段值通常用作一个缓存验证器。简单来说,如果实体值在 Last-Modified 值之后没有被更改,则认为该缓存条目有效。ETag 响应头部字段值是一个实体标记,它提供一个 “不透明” 的缓存验证器。这可能在以下几种情况下提供更可靠的验证:不方便存储修改日期;HTTP 日期值的 one-second 解决方案不够用;或者原始服务器希望避免由于使用修改日期而导致的某些冲突。

不同的浏览器有不同的配置行为。表 7-10 表明针对不同用户操作的不同浏览器的行为。

表 7. 当用户打开一个新的浏览器窗口时的 Last-Modified E-Tag 操作   Firefox 3.5 IE 8 Chrome 3 Safari 4
内容自上次访问以来没有被修改 浏览器重新发送请求到服务器。返回代码是 304 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 304 浏览器重新发送请求到服务器。返回代码是 304
内容自上次访问以来已经被修改 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200
表 8. 当用户在原始浏览器窗口中单击 Enter 按钮时的 Last-Modified E-Tag 操作   Firefox 3.5 IE 8 Chrome 3 Safari 4
内容自上次访问以来没有被修改 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器重新发送请求到服务器。返回代码是 304 浏览器重新发送请求到服务器。返回代码是 304
内容自上次访问以来已经被修改 浏览器重新发送请求到服务器。返回代码是 200 浏览器呈现来自缓存的页面 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200
表 9. 当用户按 F5 键刷新页面时的 Last-Modified E-Tag 操作   Firefox 3.5 IE 8 Chrome 3 Safari 4
内容自上次访问以来没有被修改 浏览器重新发送请求到服务器。返回代码是 304 浏览器重新发送请求到服务器。返回代码是 304 浏览器重新发送请求到服务器。返回代码是 304 浏览器重新发送请求到服务器。返回代码是 304
内容自上次访问以来已经被修改 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200
表 10. 没有缓存设置且用户单击 Back 或 Forward 按钮   Firefox 3.5 IE 8 Chrome 3 Safari 4
内容自上次访问以来没有被修改 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面
内容自上次访问以来已经被修改 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器呈现来自缓存的页面 浏览器重新发送请求到服务器。返回代码是 200

注意:所有浏览器都假定使用默认设置运行。

不进行任何缓存相关设置

如果您不定义任何缓存相关设置,则不同的浏览器有不同的行为。有时,同一个浏览器在相同的情形下每次运行时的行为都是不同的。情况可能很复杂。另外,有些不该缓存的内容如果被缓存,将会导致安全问题。
不同的浏览器有不同的行为。表 11 展示了不同的浏览器行为。

表 11. 没有缓存设置且用户打开一个新的浏览器窗口   Firefox 3.5 IE 8 Chrome 3 Safari 4
打开一个新页面 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200
在原始窗口中单击 Enter 按钮 浏览器重新发送请求到服务器。返回代码是 200 浏览器呈现来自缓存的页面。 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200
按 F5 键刷新 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200
单击 Back 或 Forward 按钮 浏览器呈现来自缓存的页面。 浏览器呈现来自缓存的页面。 浏览器重新发送请求到服务器。返回代码是 200 浏览器重新发送请求到服务器。返回代码是 200

注意:所有浏览器都假定使用默认设置运行。

最后, 概括下关键的结论:

关键结论
打开新窗口 如果指定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,则每次都重复访问.
按刷新按扭 无论为何值,都会重复访问.

 

分享到:
评论

相关推荐

    浏览器缓存机制介绍与缓存策略剖析.pptx

    浏览器缓存机制介绍与缓存策略剖析 浏览器缓存机制是指浏览器在请求资源时,对已经请求过的资源进行缓存,以便下次请求时可以直接从缓存中获取,从而提高页面加载速度和减少服务器的压力。本文将详细介绍浏览器缓存...

    浏览器缓存机制 mindMaster脑图与visio流程图

    浏览器缓存机制是互联网浏览体验中的重要组成部分,它极大地提高了网页加载速度,减少了网络带宽的消耗。在本文中,我们将深入探讨浏览器缓存的工作原理,主要包括两种主要类型的缓存:强缓存(Strong Cache)和协商...

    存储篇 1:浏览器缓存机制介绍与缓存策略剖析(1).md

    ### 浏览器缓存机制介绍与缓存策略剖析 浏览器缓存是前端性能优化的一个重要组成部分,其可以减少网络IO消耗,提高访问速度。浏览器缓存的机制可以分为四个方面:MemoryCache、ServiceWorkerCache、HTTPCache和...

    浏览器缓存机制面试常考.zip

    浏览器缓存【2024年浏览器缓存简介】 内容概要: 这篇博客为网络技术初学者提供了一个全面的理解浏览器缓存的知识。通过通俗易懂的语言,本博客介绍了浏览器缓存的工作原理,HTTP缓存控制字段,缓存策略的应用,以及...

    Http页面缓存机制

    浏览器缓存机制可以分为两类:服务器端缓存和浏览器端缓存。服务器端缓存是指服务器端存储的缓存,而浏览器端缓存是指浏览器端存储的缓存。本文主要介绍浏览器端缓存机制。 浏览器端缓存机制的重要性在于它可以减少...

    HTTP+JS+浏览器缓存技术

    浏览器缓存机制可以分为两大类:Expires 策略和 Cache-Control 策略。 一、Expires 策略 Expires 是 Web 服务器响应消息头字段,在响应 http 请求时告诉浏览器在过期时间前浏览器可以直接从浏览器缓存取数据,而...

    js浏览器缓存.doc

    对于使用Prototype.js或其他JavaScript库进行Ajax开发的开发者而言,了解并掌握如何规避浏览器缓存机制至关重要。通过在请求URL中添加随机参数或改变请求方式为POST,可以有效解决因缓存而导致的重复请求失效问题,...

    彻底理解浏览器的缓存机制.docx

    通过对浏览器缓存机制的深入理解,我们可以看到它不仅提升了用户体验,还极大地减轻了服务器的压力。在实际应用中,开发者可以通过合理设置缓存相关的HTTP头字段来优化网站性能,比如使用`Cache-Control`来指定更...

    浏览器HTTP缓存机制

    ### 浏览器HTTP缓存机制详解 #### 一、概述 HTTP缓存机制是现代Web应用中的一个重要组成部分,它能够显著提升用户体验并减轻服务器负载。本文将详细探讨浏览器HTTP缓存的工作原理及其背后的机制。 #### 二、HTTP...

    ..........

    【标题】: "深入理解Chrome浏览器缓存机制与文件结构" 【描述】: "本资料主要探讨了Chrome浏览器的缓存机制,包括HTTP缓存、磁盘缓存以及如何通过文件系统来查看和分析这些缓存。同时,还涵盖了Chrome浏览器的特定...

    2024年浏览器缓存HTTP缓存机制(面试常考).zip

    浏览器缓存【2024年浏览器缓存/HTTP缓存机制(面试常考)简介】 内容概要: 这篇博客为网络技术初学者提供了一个全面的理解浏览器缓存和HTTP缓存机制的指南。通过通俗易懂的语言,本博客介绍了浏览器缓存的工作原理...

    chrome浏览器怎么找缓存视频文件?.docx

    Chrome 浏览器缓存机制 在了解缓存视频文件的查找方法之前,需要了解 Chrome 浏览器的缓存机制。当我们在浏览器中观看视频时,浏览器会将视频文件缓存在本地,以便快速加载视频。缓存的视频文件存储在浏览器的缓存...

    清除浏览器缓存

    在现代互联网应用中,浏览器缓存机制被广泛采用以提升用户体验和减少网络流量消耗。然而,在某些情况下(如开发测试阶段或网站更新后),我们需要清除浏览器缓存来确保用户能够看到最新的网页内容。本文将详细介绍...

    禁止浏览器缓存当前文档内容

    在网页开发中,浏览器缓存机制是为了优化加载速度,但是有时会导致问题,比如服务器端更新的内容无法及时反映到客户端。为了防止这种情况,可以通过设置HTTP响应头来禁止浏览器缓存当前页面。以下是三种常用的响应头...

    面试题浏览器缓存和数据压缩.pdf

    ### 浏览器缓存机制 浏览器缓存机制主要分为两种:强制缓存和协商缓存。 1. **强制缓存**:当浏览器发起请求时,如果强制缓存生效,浏览器将直接从本地缓存中获取数据,不会向服务器发送任何请求。强制缓存可以...

    jsp去除浏览器缓存

    但在某些情况下,我们可能需要禁用缓存机制,例如: - 当页面内容频繁更新时。 - 当我们需要确保用户始终看到最新版本的页面时。 #### 三、JSP中禁用浏览器缓存的方法 在JSP页面中可以通过设置HTTP响应头来实现...

Global site tag (gtag.js) - Google Analytics