浏览器缓存的话分为强缓存和协商缓存,类型是需要根据响应头返回的内容来决定的。
本地请求流程
合理利用浏览器缓存的优点
- 减少了一部分的http请求
- 加快了浏览器的网页渲染速度
强缓存
不会向服务器发送请求,直接从缓存中读取资源,状态码200
Expires
http1.0的参数,它的值是一个绝对值。
Cache-Control
http1.1的参数, 优先级大于Expires。值是一个相对时间。
另外页面也可以使用强缓存,避免频繁的向服务器发送请求。
<meta http-equiv="Cache-Control" content="max-age=7200" />
<meta http-equiv="expires" content="Wed, 20 Jun 2017 22:33:00 GMT">
协商缓存
向服务器发送请求,服务器会根据这个请求的request header的一些参数来判断是否命中协商缓存,如果命中,则返回304状态码并带上新的response header通知浏览器从缓存中读取资源
Last-Modified if-Modify-Since
Etag if-None-Match
这两组都是成对出现的,第一次请求的响应头带上(Last-Modified 或者 Etag),那么后续的请求就会带上相对应的请求字段(if-Modify-Since 或者 if-None-Match),如果响应头没有这两个字段,那么请求头也不会携带相对应的字段。
两者差别
Last-Modified 的单位是精确到秒的, 如果一秒内多次修改,是没有办法判断的。而Etag是通过算法生成的hsah值,每次修改都会重新生成。精确度比较高。 另外 Etag 优先级 比Last-Modified 高