http缓存

http缓存

把服务器缓存的数据,存放到本地.

在发送请求的时候,会看是否会命中强缓存,若是的话,会从强缓存中获取资源,若不是的话,会从协商缓存中找资源,若协商缓存没有命令,则会去服务器获取资源.

chrome 资源

强缓存

• 先从本地找资源 --> 命中强缓存,返回200,直接使用强缓存,并且不会发送请求到服务器
• 强缓存是利用Expires或者Cache-Control，若时间未过期，则命中强缓存，使用缓存文件不发送请求。
• Cache-Control - 为了弥补Expires的缺陷而加入的,当Expires和Cache-Control同时存在时,Cache-Control优先级高于Expires.
  • public: 服务器和浏览器都可以缓存
  • private: 只能浏览器端缓存
  • no-cache: 强制浏览器在使用cache拷贝之前先提交一个http请求到源服务器进行确认。http请求没有减少，会减少一个响应体(文件内容),这种个选项类似弱缓存。
  • Max-age=60, 设置缓存最大周期,单位秒
  • no-store: 不缓存,使用协商缓存

Cache-Control: no-cache, no-store, must-revalidate
Cache-Control:public, max-age=31536000
Cache-Control: max-age=3600, must-revalidate

• 注意
  • 如果设了max-age，max-age就会覆盖expires，如果expires到期需要重新请求。
  • 在测试的时候，看到命中强缓存时，有两种状态，200 (from memory cache) cache & 200 (from disk cache)，于是去找了一下这两者的区别：
    • memory cache: 将资源存到内存中，从内存中获取。
    • disk cache：将资源缓存到磁盘中，从磁盘中获取。
    • 二者最大的区别在于：当退出进程时，内存中的数据会被清空，而磁盘的数据不会。

弱缓存

• 在本地缓存中找到该资源,发送一个http请求到服务器,服务器判断这个资源是否修改,若没有修改,则返回状态码304.
• 触发条件
  • 如果强缓存时间过期，或者没有设置，导致未命中的话。就进入到了弱缓存的阶段了

• Last-Modified(服务器)与If-Modified-Since(客户端)是一对报文头，属于http 1.0。

  • last-modified是web服务器认为文件的最后修改时间，last-modified是第一次请求文件的时候，服务器返回的一个属性。
    Last-Modified: Sat, 09 Jun 2018 08:13:56 GMT
  • 第二次请求这个文件时，浏览器把If-Modified-Since发送给服务器，询问该时间之后文件是否被修改过。
    If-Modified-Since: Sat, 09 Jun 2018 08:13:56 GMT // 跟Last-Modified的值一样

• ETag(服务器)与If-None-Match(客户端)是一对报文，属于http 1.1。

  • ETag是一个文件的唯一标志符。就像一个哈希或者指纹，每个文件都有一个单独的标志，只要这个文件发生了改变，这个标志就会发生变化。
  • ETag也是首次请求的时候，服务器返回的:
    ETag: "8F759D4F67D66A7244638AD249675BE2" // 长这样
  • If-None-Match也是浏览器发送到服务器验证，文件是否改变的:
    If-None-Match: "8F759D4F67D66A7244638AD249675BE2" // 跟ETag的值一样

• Etag/lastModified过程如下:

  • 客户端第一次向服务器发起请求,服务器将附加Last-Modified/ETag到所提供的资源上去
  • 当再一次请求资源,如果没有命中强缓存,在执行在验证时,将上次请求时服务器返回的Last-Modified/ETag一起传递给服务器。
  • 服务器检查该Last-Modified或ETag，并判断出该资源页面自上次客户端请求之后还未被修改，返回响应304和一个空的响应体。

• 同时使用这两个报文头，两个都匹配才会命中弱缓存，否则将重新请求资源。
  

• `Etag 主要为了解决 Last-Modified 无法解决的一些问题：
  *一些文件也许内容并不改变(仅仅改变的修改时间)，这个时候我们不希望文件重新加载。（Etag值会触发缓存，Last-Modified不会触发）

• If-Modified-Since能检查到的粒度是秒级的，当修改非常频繁时，Last-Modified会触发缓存，而Etag的值不会触发，重新加载。

• 某些服务器不能精确的得到文件的最后修改时间。

用户操作缓存

• F5刷新导致强缓存失效。
• ctrl+F5强制刷新页面强缓存，弱缓存都会失效。

参考

• http缓存