03-2-浏览器缓存

1. 浏览器缓存策略

1.1. 缓存校验

• 浏览器无本地缓存的情况下：

• 浏览器存在本地缓存的情况下：

1.2. 与缓存相关的HTTP字段

1.3. 用户行为与缓存更新策略(google)

2. 指令

2.1. expires

• 指令

  Syntax: expires [modified] time ;
  Syntax: expires epoch | max | off ;
  Default: expires off ;
  Context: http,server,location,if in location

• 说明

用于在响应头中添加 Expires 和 Cache-Control 字段，其中时间可以时正的也可以时负的.
Cache-COntrol的值取决于expires中的值:

0 | Date - t | Cache-Control: no-cache | | t

= 0 | Date + t | Cache-Control: max-age=t | | epoch | Thu, 01 Jan 1970 00:00:01 GMT | Cache-Control: no-cache | | max | Thu, 31 Dec 2037 23:55:55 GMT | Cache-Control: max-age=315360000 | | off | disable | disable |

时间格式：

days |

2.2. etag

官方文档：https://nginx.org/en/docs/http/ngx_http_core_module.html#etag
nginx etag计算方式：文件最后修改时间(秒级)16进制,文件长度16进制。不涉及文件的md5信息。
apache etag计算方式：文件inode,最后修改时间(秒级)16进制,文件长度16进制。不涉及文件的md5信息。
默认开启etag，一般场景下无需配置。在负载均衡的场景中，静态资源建议使用共享存储，否则etag值会不一致。

3. 案例

3.1. 配置

针对静态文件: text/. image/. vedio/. js zip pdf 进行缓存，但是涉及到登陆相关的js不能缓存(^/gt..js$):[root@centos-81 ~]# cat /etc/nginx/nginx.conf

map $sent_http_content_type $expires {
    default off;
    ~image/ max ;
    ~vedio/ 7d ;
    text/plain 24h;
    # text/css   modified 24h; 不支持
    text/css   24h;
    text/html  24h;
    application/javascript 24h;
    application/pdf 30d; 
    application/zip 30d;
}
expires $expires ;
include /etc/nginx/conf.d/*.conf;

[root@centos-81 ~]# cat /etc/nginx/conf.d/localhost.conf

location ~ ^/gt[a-z]+ {
    if ($request_uri ~ .*\.js$) {
        expires off ;
    }
    proxy_pass http://www.jsmlr.gov.cn ;
}

3.2. 测试

[root@centos-50 ~]# curl -I -A “User-Agent:Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0” 192.168.1.81 # html 缓存成功

HTTP/1.1 200 OK
Server: nginx/1.14.2
Date: Sun, 30 Dec 2018 12:58:52 GMT
Content-Type: text/html
Content-Length: 24008
Last-Modified: Tue, 14 Nov 2017 10:36:39 GMT
Connection: keep-alive
ETag: "5a0ac737-5dc8"
Expires: Mon, 31 Dec 2018 12:58:52 GMT
Cache-Control: max-age=86400
Accept-Ranges: bytes

[root@centos-50 ~]# curl -I -A “User-Agent:Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0” 192.168.1.81/images/jquery-1.9.1.min.js ## js 缓存成功

HTTP/1.1 200 OK
Server: nginx/1.14.2
Date: Sun, 30 Dec 2018 12:59:25 GMT
Content-Type: application/javascript
Content-Length: 92631
Last-Modified: Wed, 26 Apr 2017 07:51:35 GMT
Connection: keep-alive
ETag: "59005187-169d7"
Expires: Mon, 31 Dec 2018 12:59:25 GMT
Cache-Control: max-age=86400
Accept-Ranges: bytes

[root@centos-50 ~]# curl -I -A “User-Agent:Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0” 192.168.1.81/a.pdf ## pdf 缓存成功

HTTP/1.1 200 OK
Server: nginx/1.14.2
Date: Sun, 30 Dec 2018 13:00:05 GMT
Content-Type: application/pdf
Content-Length: 192088019
Last-Modified: Sat, 29 Dec 2018 04:17:00 GMT
Connection: keep-alive
ETag: "5c26f53c-b7307d3"
Expires: Tue, 29 Jan 2019 13:00:05 GMT
Cache-Control: max-age=2592000
Accept-Ranges: bytes

[root@centos-50 ~]# curl -I -A “User-Agent:Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0” 192.168.1.81/gtwzqxxgk/imagesls/xxgk-zfxx4.png ## 成功缓存

HTTP/1.1 200 OK
Server: nginx/1.14.2
Date: Sun, 30 Dec 2018 13:09:19 GMT
Content-Type: image/png
Content-Length: 15283
Connection: keep-alive
Last-Modified: Wed, 01 Mar 2017 05:44:28 GMT
ETag: "3bb3-549a4ce4a6700"
Accept-Ranges: bytes
Access-Control-Allow-Origin: http://www.jsmlr.gov.cn:80/gtxx/
Expires: Thu, 31 Dec 2037 23:55:55 GMT
Cache-Control: max-age=315360000

[root@centos-50 ~]# curl -I -A “User-Agent:Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0” 192.168.1.81/gtwzqxxgk/js/Date/calendar.js ## 未缓存

HTTP/1.1 200 OK
Server: nginx/1.14.2
Date: Sun, 30 Dec 2018 13:10:57 GMT
Content-Type: application/javascript
Content-Length: 18007
Connection: keep-alive
Last-Modified: Wed, 09 Jun 2010 01:33:28 GMT
ETag: "4657-4888ee48caa00"
Accept-Ranges: bytes
Access-Control-Allow-Origin: http://www.jsmlr.gov.cn:80/gtxx/