浏览器调试工具的disable cache功能，相信在座的各位都用过。开启这个功能，浏览器关于当前网站的js、css、图片...等缓存都会失效，所有请求都会重新发送给服务器。ctrl+F5也可以达到同样的效果。
下面就来说说开启这个功能的时候浏览器到底做了什么
浏览器做了什么
首先说明一下，打开disbale cache浏览器并不会去主动删除本地的这些缓存、也不会不让把请求到的资源缓存到本地。我是怎么得出这个结论的呢？
不会删除本地缓存
下面这张图左边是勾选上disbale cache的情况，右边是不勾选disbale cache的情况
当我勾选Disable cache重新加载页面后，再取消勾选Disable cache重新加载页面，会发现浏览器立即就使用缓存了，由此可以证明我上面的结论：缓存一直都在，只不过就看浏览器想不想用了。
操纵请求头
浏览器怎么可以做到这么任性的呢？原因就是它可以操纵http的请求头（request header）。
打开disbale cache，随便找一个请求看一下
http的请求头里多了cache-control，pragma这两个东西。
cache-control
cache-control这个东西大家肯定都不陌生，毕竟是http1.1的“缓存三宝”之一。它是http1.1的产物，也就是说只有http1.1及以上这个字段才有用，所以上面我们看到，浏览器又给请求头里放了个prgama，这个功能其实和cache-control一样，只不过是浏览器为了兼容http1.0，所以下面我只说cache-control。
no-cache
cache-control的值被设置成no-cache，这边大家普遍会有个误区，看这个字面意思很多人会理解成不缓存，其实这种理解是不对的、错的。
no-cache正确的理解应该是不做强缓存，但是协商缓存还是要的，浏览器的请求会发送给服务器，然后服务器验证资源是否过期，没过期的话http状态码（status code）就是304，这时浏览器会使用本地的缓存；过期的话就是200，这时浏览器会使用服务器发送过来的内容。
请求头和响应头设置的区别
cache-control可以设置在请求头和响应头（response headers），而且用法也是一样的，只不过代表的含义有些许差别。
以 cache-control: no-cache为例
- 设置在请求头：告诉浏览器这一次的http请求不许使用强缓存，也就是说这次请求必须给我发送到服务器。
- 设置在响应头：告诉浏览器这一次的http的响应内容你可以先缓存下来，但是下一次有同样请求的时候，你还是得把请求发送到服务器。
说到这里，大家应该就明白了Disable cache的时候浏览器到底搞了什么鬼。
接下去把思维发散一下
不设置会怎样？
要是请求头和响应头里都没有cache-control，浏览器会怎么做？还会不会缓存了？缓存多久？
实践出真知，去找一个符合上面条件的请求看一下，见下图
结论就是浏览器会缓存，而且还是命中的强缓存，直接从disk或者memory中读取的。
至于能缓存多久这个问题，根据百度出来的结果如下
这也就能解释为什么同样的请求，有时候是命中强缓存（from disk or from memory），有时候是304了。
都设置会怎样？
要是请求头和响应头都设置了cache-control，而且它们的值还设置成不同的，浏览器会怎么做呢？
有一点搞清楚这个问题就简单了，下面划重点、划重点、划重点...
cache-control 设置在请求头，影响的是这一次请求；cache-control设置在响应头，影响的是下一次请求
你品，你细品...
结语
大家有什么关于浏览器缓存机制或者http协议的问题欢迎在评论区留言讨论