浏览器缓存
- 浏览器处理网页的方式
- 走到协商缓存会返回 304
- 走到强缓存会返回 200
浏览器缓存执行流程
- 合理使用浏览器缓存
- 页面连接的请求无须做长时间缓存
- 敏感数据像订单等不宜做缓存
- 静态资源部分，通常会设定一个较长的缓存时间
- 冷热数据分离，减少请求量
- 不要随意修改文件，建议使用 ?version=** 调用多版本
- 不建议使用 ETag,尤其是分布式
- header 字段输出方式
- html 输出方式
<meta http-equiv="Cache-Control" content="max-age=7200">
- php 输出方式
<?php
header('Cache-Control:max-age=7200');
- 强缓存阶段的 header 字段
启用强缓存的状态为 200 (from disk cache)
执行到强缓存的时机为：
graph TD
A[浏览器] --> B[是否有缓存]
B --> C{Yes or No?}
C --> |yes| D[是否过期]
D --> |no| E[就使用缓存中的内容]
- Pragma (HTTP 1.0)
- Expires (HTTP 1.0) （设定的是一个精确的时间）
- Cache-control (HTTP 1.1)
- max-age （缓存最大的秒数）
- Public \ private （当设置为 public 且采用 https 协议的时候，也会转换成 private）
- no-cache \ no-store （不允许存放在用户的硬盘里） \ must-revalidate （必须请求认证）
如果这三个参数同时出现的话：那么优先顺序为，1、Cache-control 2、Pragma 3、Expires
- 协商缓存阶段的 header 字段
启用协商缓存的状态为 304 Not Modified
- Last-Modified：末次更新标记，文件最后一次更新的具体时间（下行 response）
- If-Modified-Since ：资源上次的修改时间（上行 request）
- E-Tag ： 实体与标记（下行）
- If-None-Match ：资源内容标识（上行）
协商缓存的执行流程如下：
graph TD
A[浏览器第一次请求服务器] --> B[服务器 Response Headers 携带 last-modified: Mon, 21 Oct 2019 00:44:35 GMT 返回给浏览器]
B --> C[浏览器第二次请求服务器 Request Headers 携带 If-Modified-Since: Mon, 21 Oct 2019 00:44:35 GMT]
C --> D{If-Modified-Since 和文件的 Last-Modified 作比较}
D --> |yes| E[文件的最后修改时间没有变化]
E --> F[Status Code: 304 Not Modified]
因为 Last-Modified 和 If-Modified-Since 字段的最小颗粒度为秒 （Mon, 21 Oct 2019 00:44:35 GMT） ，那么就会出现一个问题：当某个文件在 1s 中更改 n 次时，服务器就完全不知道是否需要执行强制缓存。这就引入了 E-Tag 的概念。当文件只要修改时，E-Tag 就会重新生成一个字符串，之后浏览器第二次请求的时候，重新生成的字符串被 If-None-Match 字段携带。「E-Tag」、「If-None-Match」 和 「Last-Modified」、「If-Modified-Since」执行流程完全一致。
网友评论