nginx配置http缓存(强缓存、协商缓存、无缓存)

187 阅读1分钟

强缓存、协商缓存、无缓存区别

强缓存:浏览器不与服务端协商直接取浏览器缓存
协商缓存:浏览器会先向服务器确认资源的有效性后才决定是从缓存中取资源还是重新获取资源
无缓存:浏览器直接向服务器重新获取资源

tip:如果浏览器端禁用了缓存这些缓存配置是不起效果的

优先级:协商缓 > 强缓存

image.png

强缓存配置

  1. Expires:浏览器再次加载资源时,如果在这个过期时间内,则命中强缓存。
  2. max-age:在这个请求正确返回时间的x分钟内再次加载资源,就会命中强缓存。

max-age优先级高于Expires

配置示例:

 location / {
    root   html;
    index  index.html index.htm;
    add_header Last-Modified "";
    add_header Cache-Control "max-age=300"; // 缓存时间 
    etag off;
}

查看网络请求显示max-age则配置成功了

image.png

在该时间段内再加载该资源则会命中缓存:

image.png

协商缓存

  1. Last-Modified:记录资源最后修改的时间。

    缺点:只要编辑了,不管内容是否真的有改变,都会以这最后修改的时间作为判断依据,当成新资源返回。

  2. ETag:基于资源的内容编码生成一串唯一的标识字符串只要内容不同就会生成不同的ETag。(推荐使用)

配置示例:

 location / {
    root   html;
    index  index.html index.htm;
    add_header Last-Modified "";
    etag on;
}

查看网络请求:

image.png

资源无修改继续请求资源:

image.png

无缓存配置

 location / {
    root   html;
    index  index.html index.htm;
    add_header Cache-Control no-store;
}

网络请求:

image.png

这样每次加载都会去服务器拿资源。