浏览器缓存机制

浏览器缓存机制

• 本文地址: 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.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,则每次都重复访问.
按刷新按扭	无论为何值,都会重复访问.

分享到： 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

    学习了，呵呵 。