update 前端本地缓存概况之浏览器缓存策略

ops/前端本地缓存概况之浏览器缓存策略.md

@@ -73,10 +73,13 @@
 ![image.png](https://intranetproxy.alipay.com/skylark/lark/0/2019/png/84653/1558062783657-92e4fc45-38a8-4c6e-84c0-1a7a890ef07c.png#align=left&display=inline&height=407&name=image.png&originHeight=407&originWidth=800&size=106021&status=done&width=800)
 
 
+![image.png](https://intranetproxy.alipay.com/skylark/lark/0/2019/png/84653/1558439341166-a01890a7-d933-4292-b1b1-2536d27ef52c.png#align=left&display=inline&height=900&name=image.png&originHeight=900&originWidth=1221&size=85640&status=done&width=1221)
 
-![image.png](https://intranetproxy.alipay.com/skylark/lark/0/2019/png/84653/1558439341166-a01890a7-d933-4292-b1b1-2536d27ef52c.png#align=left&display=inline&height=900&name=image.png&originHeight=900&originWidth=1221&size=85640&status=done&width=1221)<br />文件有更新，协商缓存失效，返回200及相关数据资源
+文件有更新，协商缓存失效，返回200及相关数据资源
 
-![image.png](https://intranetproxy.alipay.com/skylark/lark/0/2019/png/84653/1558439296918-b969ce9c-32a1-4500-bb77-ae0496146822.png#align=left&display=inline&height=901&name=image.png&originHeight=901&originWidth=1225&size=97526&status=done&width=1225)<br />文件未更新，协商缓存生效，返回304及空响应及，浏览器直接读取缓存资源
+![image.png](https://intranetproxy.alipay.com/skylark/lark/0/2019/png/84653/1558439296918-b969ce9c-32a1-4500-bb77-ae0496146822.png#align=left&display=inline&height=901&name=image.png&originHeight=901&originWidth=1225&size=97526&status=done&width=1225)
+
+文件未更新，协商缓存生效，返回304及空响应及，浏览器直接读取缓存资源
 
 如图所示，http请求携带的缓存标识可以有两个，分别是 Last-modified和Etag，接下来我们慢慢说一说这两个。
 
@@ -99,8 +102,7 @@ Last-modified——最后的修改时间，根据比对修改时间可以确定
 
 Etag是服务器响应请求时，返回当前资源文件的一个唯一标识，一般是一个hash值，只要资源有变化，Etag就会重新生成。
 
-浏览器在下一次加载资源向服务器发送请求时，会将上一次返回的Etag值放到请求上行的header中“If-None-Match”属性里，服务器只需要比较客户端传来的header-“If-None-Match”值跟自己服务器上该资源的Etag是否一致，就能直接判断资源相对客户端缓存而言是否有修改。如果服务器发现Etag匹配不上，那么直接返回状态码200及新资源（当然也包括了新的Etag）；如果匹配是一致的，则直接返回304和空的响应体，直接约定从浏览器缓存中读取。这里就避免了“last-modified”的秒级误差问题。<br />
-<br />至此，我们已经介绍了3种缓存：memory cache、disk cache、304，那么我们下面用一张流线图描述下请求及缓存过程：
+浏览器在下一次加载资源向服务器发送请求时，会将上一次返回的Etag值放到请求上行的header中“If-None-Match”属性里，服务器只需要比较客户端传来的header-“If-None-Match”值跟自己服务器上该资源的Etag是否一致，就能直接判断资源相对客户端缓存而言是否有修改。如果服务器发现Etag匹配不上，那么直接返回状态码200及新资源（当然也包括了新的Etag）；如果匹配是一致的，则直接返回304和空的响应体，直接约定从浏览器缓存中读取。这里就避免了“last-modified”的秒级误差问题。至此，我们已经介绍了3种缓存：memory cache、disk cache、304，那么我们下面用一张流线图描述下请求及缓存过程：
 
 ![image.png](https://intranetproxy.alipay.com/skylark/lark/0/2019/png/84653/1558489929900-b9afc3e5-c183-4622-93ca-a2c2a49b7a17.png#align=left&display=inline&height=808&name=image.png&originHeight=808&originWidth=1258&size=97873&status=done&width=1258)