文章参考： https://my.oschina.net/ososchina/blog/494074
https://www.zhihu.com/question/28725359
https://juejin.im/post/5a64541bf265da3e2d338862
· 200 OK (from cache) 指的是浏览器都没和服务器确认，直接用了浏览器缓存。
· 304 Not Modified 比 200 OK (from cache) 慢，指的是浏览器还向服务器确认了下 "If-Not-Modified"，才用的缓存。
1)关于 Last-Modified
在浏览器第一次请求某一个URL时，服务器端的返回状态会是200，资源响应头有一个Last-Modified的属性标记此文件在服务期端最后被修改的时间，另外一半也有个Etag，格式类似这样：
Last-Modified:Fri, 15 Feb 2013 03:06:18 GMT
ETag:"be15b26c29bce1:0" #可选，这里为了准确确认资源是否变化(毫秒级)
举例
请求头：
1.png
客户端第二次请求此URL时，根据 HTTP 协议的规定，浏览器会向服务器传送 If-Modified-Since和If-None-Match(可选报头，值Etag的值) 报头，询问该时间之后文件是否有被修改过。
响应头：
2.png
如果服务器端的资源没有变化，则自动返回 HTTP 304 （Not Changed.）状态码，内容为空，否则重新发起请求，请求下载资源这样就节省了传输数据量。当服务器端代码发生改变或者重启服务器时，则重新发出资源，返回和第一次请求时类似。从而保证不向客户端重复发出资源，也保证当服务器有变化时，客户端能够得到最新的资源。
过程如下:
-
客户端请求一个页面（A）。
-
服务器返回页面A，并在给A加上一个Last-Modified/ETag。
-
客户端展现该页面，并将页面连同Last-Modified/ETag一起缓存。
-
客户再次请求页面A，并将上次请求时服务器返回的Last-Modified/ETag一起传递给服务器。
-
服务器检查该Last-Modified或ETag，并判断出该页面自上次客户端请求之后还未被修改，直接返回响应304和一个空的响应体。
此外，如果缓存服务器版本，类型不同，建议使用Last-Modified，Etag可能造成缓存无法验证的问题
二.缓存有效期期的实现（Cache-Control与Expires）
HTTP中，通过Cache-Control首部和Expires首部为文档指定了过期时间，通过对过期时间的判断，缓存就可以知道文档是不是在保质期内。Expires首部和Cache-Control:max-age首部都是来告诉缓存文档有没有过期，为什么需要两个响应首部来做这件简单的事情了？其实这一切都是历史原因，Expires首部是HTTP 1.0中提出来的，因为他使用的是绝对日期，如果服务端和客户端时钟不同步的话（实际上这种情况非常常见），缓存可能就会认为文档已经过了保质期。
- Last-Modified&Cache-Control 与 Expire比较
1.Last-Modified & Cache-Control
设置 header("Last-Modified: ".gmdate("D, d M Y H:i:s", time() )." GMT");
Last-Modified虽然使用了缓存，但是每次打开页面依然需要向服务器发起http请求，浏览器根据用户的$_SERVER['HTTP_IF_MODIFIED_SINCE']来判断浏览器的内容是否过期，没过期的话返回304状态，浏览器内容从缓存中读取。
此外 Cache-Control也很重要，如果他的值是max-age=0，max-stable,min-refresh等于0或no-store之类的，缓存是不会被缓存的,每次都会请求服务器。如果是max-age，max-stable,min-refresh[大于0]或only-if-cached，immutable，那么很可能出现 from cache现象。
2.Expires缓存控制
设置 header("Expires: ".gmdate("D, d M Y H:i:s", time()+$cache_time )." GMT");
状态码依然是200，时间依然是旧的时间，Size栏目显示为from cache，表示内容是直接从浏览器读取，浏览器根本就没有向服务器发起http请求。
3.png
2）200 OK (from cache) 实现方案
Status 200 Ok (from cache)出现的条件是Cache-Control或者Expires满足一定的条件。
注意：缓存控制是服务器进行报头建议，以下报头是响应头，不是请求头
2.1 使用 Cache-Control
1.[(max-age|max-stable|min-refresh) = 缓存创建时间 < 当前系统时间][immutable][only-if-cached]
2.缓存必须带有ETag或者Last-Modified
Cache-Control：public,Max-Age=84800
ETag:"f6c01531e9c65fa96f3d40409fd030f1"
image
2.2 Expires不能过期
Expires：Sun, 31 Jul 2016 00:19:47 GMT
image
以上2种方案只要实现一种即可实现资源from cache
对于浏览器而言，还有一种数据是 DataURL协议的数据，这种数据也会从缓存读取，实现from cache ,但是，如果将所有数据转码成DataURL,会出现性能问题。
image
三.缓存使用技巧
①.无论是开发阶段还是生产阶段，建议使用Cache-Control + Last-Modified或Tag控制缓存
②.开发阶段， 建议使用Cache-Control:[no-cache,no-store|Max-Age=0]这样可以阻止浏览器使用缓存
③无论是开发阶段还是生产阶段，如果是永远不会被更改的资源，那么建议使用缓存Cache-Control:[Max-Age=3600][only-if-cached][immutable] 从而实现from cache，减少http请求。
④.如果是生产阶段建议使用Cache-Control:Max-Age=3600[no-cache|] ，缓存1小时，每次必须到服务器进行校验
⑤禁止缓存
Cache-Control: no-cache, no-store, must-revalidate
⑥缓存静态资源也可以加上public，实现跨域缓存共享
Cache-Control:public, max-age=31536000,no-cache
⑦ must-revalidate，校验本地缓存是否过期，过期了才去请求服务器更新缓存
⑧ 默认情况下，Cache-Control:public缓存都回去和服务器校验的
网友评论