持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第8天，点击查看活动详情
前言
浏览器缓存在前端可谓是非常重要的，合理的使用浏览器缓存能起到很不错的效果，可以减轻服务端的压力，提升页面的整体加载速度等等。
浏览器缓存
浏览器的缓存分为两种类型：强缓存、协商缓存。
- 强缓存：强缓存从字面意思就可以看出来非常的强硬，我们知道当请求接口成功的时候都会返回200，强缓存也不例外，即使触发了强缓存接口返回的还是200，但不同点在于当你点开network的时候你会发现他的size字段显示的不是多少B，而是from cache或者 disk cache,如下图：（我是在chrome浏览器实验的）
这就表明这次请求触发了强缓存，请求回来的内容是从内存拿的，那到底如何触发的强缓存呢，那么就要看下面的图了
上图中的Cache-Control:max-age=180就是触发强缓存的关键，它代表的意思是从第一次请求开始缓存180秒，记得单位是秒，它是http1.1中提出的新的属性；在它之前的http1.0还有一个属性Expires，它也会触发强缓存，它的值是一个GMT格式的字符串，表示在到何时之前再次请求接口都触发强缓存。当两者共存的情况下Cache-Control的优先级更高。
强缓存可以通过后端通过代码直接配置，也可以通过配置web服务器来实现。
协商缓存
顾名思义，就是和服务器商量一下，看到底是后端返回数据还是请求缓存中的数据，它和强制缓存最大的不同就是强制缓存不会发送真实的http请求，而协商缓存会。协商缓存的接口返回的code码是304。
协商缓存的形式是在响应头中加入Last-Modified字段，当再次请求这个接口时会在请求头中加入If-Modified-Since字段，它的值就是第一次请求接口响应头中的Last-Modified的值。
总结
强缓存和协商缓存的相同点就是在缓存失效之前再次请求接口都会从缓存中去拿数据；不同点是强制缓存不发起真实的http请求，因为当第一次触发强制缓存的时候会把整个响应头存下来，所以再次调用接口时的那个200是当初存下来的响应头。协商缓存会发起真实的http请求，这是服务器会检查是否触发了协商缓存，如果触发了就让它从内存中取数据，否则就返回最新的资源。还有一点，一般一个接口请求的过程是先检查是否命中了强制缓存，如果没命中再检查是否命中了协商缓存。
