浏览器缓存机制

• 本文地址: http://www.laruence.com/2010/03/05/1332.html
• 文章转自: http://harry.javaeye.com/blog/605749

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

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

Last-Modified/E-Tag

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

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

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

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

不进行任何缓存相关设置

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

表 11. 没有缓存设置且用户打开一个新的浏览器窗口
 Firefox 3.5IE 8Chrome 3Safari 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,则每次都重复访问.按刷新按扭无论为何值,都会重复访问.

分享到：0

Random Posts:

• 关于一笔试题(Iterator模式)
• PHP运算符优先级的一个例外
• PHP5多层继承顺序的bug
• JS文件装载器(Eve Js Loader)
• Yar – 并行的RPC框架(Concurrent RPC framework)
• pkg-config与LD_LIBRARY_PATH
• 深入Mysql字符集设置
• 深入理解PHP原理之函数(Introspecting PHP Function)
• 也谈PostgreSQL的同步配置(Slony)
• PHP的老式语法

Tags: cache-control, 浏览器, 缓存

Filed in 转载

« NCR与HTML Entities

使用SoapHeader实现Soap请求验证 »

24 Responses to “浏览器缓存机制”

1. 白一梓 | 27 Nov 2015 22:30

   对于不设置任何缓存头的HTTP请求，其下次请求是否使用缓存的策略是不固定的

2. Canton Fair Interpreter | 02 Nov 2015 19:41

   学无止境.感谢作者.

3. 记一些浏览器缓存原先不太熟悉的东西 – HTML/CSS-java知识分享 | 14 Oct 2015 22:18

   [...] http://www.laruence.com/2010/03/05/1332.html [...]

4. Jane | 16 Jan 2015 08:53

   I would like to thank you for the efforts you’ve put in penning this website.
   I am hoping to see the same high-grade blog posts by you in the future as well.
   In truth, your creative writing abilities has motivated me to
   get my own, personal website now 

   web site – Jane -

5. 【Web缓存机制系列】2 – Web浏览器的缓存机制 | Tencent AlloyTeam | 05 Dec 2013 21:57

   [...] 《浏览器缓存机制》：不同浏览器对用户操作行为处理比较 [...]

6. Web缓存机制综述（HTML5缓存总结与细节释疑） | 极客我爱你 geek521.com | 18 Oct 2013 09:47

   [...] 浏览器缓存机制》：不同浏览器对用户操作行为处理比较 [...]

7. 猪头 | 15 Mar 2013 16:34

   chrome和firefox下history.back()时如果要获得新的内容而不是缓存的话,只设置no-cache不行,还必须设置一个no-store.否则返回的话仍是缓存内容.这里有更详细的分析IE下和chrome下对no-cache的不同.http://www.smalluv.com/php_code_29.html

8. 服务器与浏览器缓存协商控制机制的总结 | Ginano–生活本该如此精彩 | 13 Mar 2013 19:29

   [...] 【2】浏览器缓存刷新F5/CTRL+F5对比 [...]

9. {Web缓存机制概述} 5 – Web App时代的缓存机制新思路&全文总结 | h5train | 07 Jan 2013 02:00

   [...] http://www.procata.com/cachetest/ http://www.web-caching.com/cacheability.htmlhttp://www.laruence.com/2010/03/05/1332.html http://sofish.de/1449 [...]

10. IE 下 JQUERY AJAX 请求 官方原理 | 南龙的小站 | 22 Jun 2012 20:12

    [...] 各对待缓存的处理不一. 可参考:http://www.laruence.com/2010/03/05/1332.html 未分类就可以, 浏览器, 磁盘, 缓存, 请求 ← AVR [...]

11. 【Web缓存机制概述】5 – Web App时代的缓存机制新思路 | 星科技 | 26 May 2012 04:28

    [...] http://www.laruence.com/2010/03/05/1332.html [...]

12. neekey | 14 Apr 2012 13:10

    非常详细的介绍！不过自己测试了一下，发现即使设置了max-age，直接在浏览器中输入的url资源，都会重新去请求服务器。

    比如一个index.css 文件，如果是在一个index.html文件中被引用，设置max-age后，在到期前，回车index.html页面，index.css会直接读取缓存而不向服务器发送请求。

    但是如果直接将index.css在浏览器中输入，则不管如何都会去请求服务器。

    请问下这个是什么原因

13. 【Web缓存机制概述】5 – Web App时代的缓存机制新思路 & 全文总结 | Tencent Alloy Team 2012| 22 Mar 2012 00:16

    [...] http://www.laruence.com/2010/03/05/1332.html [...]

14. 【Web缓存机制概述】2 – Web浏览器的缓存机制 | Tencent Alloy Team 2012 | 22 Mar 2012 00:15

    [...] 《浏览器缓存机制》：不同浏览器对用户操作行为处理比较 [...]

15. Mr.CO | 26 Aug 2011 14:01

    不错！好东东！学习了！
    博主想给你交换个友链哦！

16. Shanghai Business Interpreter | 04 May 2011 16:44

    好深奥

17. Tour guide beijing | 10 Sep 2010 10:03

    我的新网站改版后，测试一直出错，检查一直找不到错误。问了人才知道原来是浏览器缓存的问题。刚好看到你的博客，收藏起来先，以后或许还用得着。嘻嘻。

18. 达达的Google Reader分享 [2010-03-05] : : 9RIA.Com 天地会博客聚合 | 29 May 2010 13:57

    [...] 浏览器缓存机制 [...]

19. 第三章：添加Expires头 —《高性能网站建设指南》读书笔记 – im Png | 11 May 2010 18:14

    [...] 更多的关于浏览器缓存及其参数可以参看浏览器缓存机制一文。 [...]

20. 达达的Google Reader分享 [2010-03-05] « 9RIA.Com 天地会博客聚合 | 07 May 2010 10:55

    [...] 浏览器缓存机制 [...]

21. bailey | 05 May 2010 17:04

    不错 顶

22. yufeng | 25 Mar 2010 18:25

    呵呵，你的博客被墙了，唉。

23. beeboo | 17 Mar 2010 23:38

    好文章！

24. yufeng | 17 Mar 2010 12:25

    学习了，呵呵 。