http头缓存相关详细总结

http 请求会返还头部信息和主题内容,头部信息分为General,Pesponse, Request:举个例子

blob.png

包含请求地址,方法,状态码,地址:端口

blob.png

包含跨域白名单,连接方式,压缩方式,返回格式,日期,Keep-Alive,还有些服务器相关的东西

blob.png

包含请求格式,接受哪种压缩方式,哪种语言,Cache控制,链接方式,host,Pragme,User-Agent等

这里先着重研究一下keep-alive到底是什么鬼,它对页面打开速度有影响吗?对服务器会增加压力吗?看来需要新开一片文章来说了,暂时放着。

那么,Pargma,与Cache-Control,还有Expires,Last-Modified这些到底是什么关系,相互有什么区别,优先级怎么处理。

blob.png

Pragma 

网上搜了一圈貌似Pragma只有一个值no-cache,用来禁止缓存的

Expires

告诉浏览器过期时间,缺点是需要跟客户端时间匹配,客户端时间不可靠。

[demo0]

Cache-Control 这个功能优点强大,但我们常见的只是用max-age

Cache-Control 提供了5种属性;那么如果同时设置:

Cache-Control :no-cahce,max-age:600; 那到底是缓存还是不缓存?

做个实验试试:

header("Cache-Control:max-age=600,no-cache"); 

[demo1]

缓存成功

header("Cache-Control:no-cache,max-age=600"); //位置换一下

[demo2]

缓存成功

结论:no-cache优先级比max-age 高,与顺序无关;

Last-Modified : 服务器告诉浏览器这个文件的修改时间。

If-Modified-Since:浏览器告诉服务器这个文件的修改时间

Last-Modified 和 If-Modified-Since必须要一起使用。

[demo3]

Etag:服务器给文件生成的唯一标识。

If-None-Match: 浏览器告诉服务器这个文件的标识。

[demo4]

那么既然有5种方法控制缓存,他们都加上的话,优先级又是怎样呢?

Pragma,Expires,Cache-Control ,Last-Modified ,Etag

实验1:

blob.png

[demo5]

结论:每次都请求服务器,证明Pragma生效,所以优先级比其他都高。

那么剩下的Expires,Cache-Control ,Last-Modified ,Etag 优先级又如何?

先比较 Expires,Cache-Control

blob.png

[demo6]

结论:每次都请求服务器,证明Cache-Control生效,所以优先级比Expires高。

再比较 Last-Modified ,Etag 

blob.png

[demo7]

结论:按f5的时候,都请求服务器,同时带上If-None-Match,If-Modified-Since,究竟会不会返回304,这是服务器说了算。所以Last-Modified 和Etag比较是没有意义的。 

然后将两组优先级高的提取出来,Last-Modified和Etag就把他们当中一个东西吧。 

Cache-Control  VS Last-Modified/Etag 

blob.png

结论:每次按地址栏回车都会请求服务器,证明Cache-Control优先级更高。

剩下 Expires VS ast-Modified/Etag 

blob.png

结论:在Expries过期的情况下,每次按地址栏回车,都会请求,证明Expires优先级更高。

最后来个总的排名: Pragma>Cache-Control>Expires>Last-Modified||Etag

操作行为对资源缓存的影响:

blob.png

按Ctrl+F5就没啥好说的啦,强制刷新,其实就是If-None-Match,If-Modified-Since都不会带上,导致服务返回200;

按F5的话其实都会请求服务器,但是如果有Last-Modified/Etag,那么就会带上If-None-Match/If-Modified-Since。服务器判断是否返回304

其他操作行为都不会请求服务器

最终结论,如果Expires,Cache-Control ,Last-Modified ,Etag存在,那么以Cache-Control 为准。

发表评论