关于Cache的四大属性:
优先级:
expires << cache-control
last-modified << etag
现在使用一般是cache-control 和etag配合使用
1. Cache-Control:
设置相对过期时间, max-age指明以秒为单位的缓存时间. 若对静态资源只缓存一次, 可以设置max-age的值为315360000000 (一万年). 比如对于提交的订单,为了防止浏览器回退重新提交,可以使用Cache-Control之no-store绝对禁止缓存,即便浏览器回退依然请求的是服务器,进而判断订单的状态给出相应的提示信息!
Http协议的cache-control的常见取值及其组合释义:
no-cache: 协商缓存,每次请求都会带etag和last-modified,服务端会进行对比(通过它们判断是否有资源更改),如果更改了就直接返回新资源,同时更新这两个值,状态码为200;如果没有更改则不返回body(节省流量)—-比较常用
no-store: 不仅不能缓存, 连暂存也不可以(即: 临时文件夹中不能暂存该资源).
private(默认): 只能在浏览器中缓存, 只有在第一次请求的时候才访问服务器, 若有max-age, 则缓存期间不访问服务器.
public: 可以被任何缓存区缓存, 如: 浏览器、服务器、代理服务器等.
max-age: 相对过期时间, 即以秒为单位的缓存时间.
no-cache, private: 打开新窗口时候重新访问服务器, 若设置max-age, 则缓存期间不访问服务器.
– private, 正数的max-age: 后退时候不会访问服务器.
– no-cache, 正数的max-age: 后退时会访问服务器.
nginx配置
location ~* \.(css|js|png|jpg|jpeg|gif|gz|svg|mp4|ogg|ogv|webm|htc|xml|woff)$ {
# 同上,通配所有以.css/.js/…结尾的请求
access_log off;
add_header Cache-Control no-cache;
}
2. Expires:—图片等资源(名字不变的)经常不更新的建议使用
设置以分钟为单位的绝对过期时间, 优先级比Cache-Control低, 同时设置Expires和Cache-Control则后者生效. 也就是说要注意一点: Cache-Control的优先级高于Expires
expires起到控制页面缓存的作用,合理配置expires可以减少很多服务器的请求, expires的配置可以在http段中或者server段中或者location段中. 比如控制图片等过期时间为30天, 可以配置如下:
location ~ \.(gif|jpg|jpeg|png|bmp|ico)$ {
root /var/www/img/;
expires 30d;
}
再比如:
location ~ \.(wma|wmv|asf|mp3|mmf|zip|rar|swf|flv)$ {
root /var/www/upload/;
expires max;
}
3. Last-Modified:
该资源的最后修改时间, 在浏览器下一次请求资源时, 浏览器将先发送一个请求到服务器上, 并附上If-modified-Since头来说明浏览器所缓存资源的最后修改时间, 如果服务器发现没有修改, 则直接返回304(Not Modified)回应信息给浏览器(内容很少), 如果服务器对比时间发现修改了, 则照常返回所请求的资源.
其中last-Modified在nginx中默认是开启的
示例1:本地缓存3600s,超出时间则从服务器获取
if ($request_uri ~* “^/$|^/search/.+/|^/company/.+/”) {
add_header Cache-Control max-age=3600;
}
示例2:配合no-cache使用,进行协商缓存
if ($request_filename ~ .*\.(htm|html)$)
{
add_header Cache-Control no-cache;
}
4. Etag/if-None-Match
这两个和cache-control配合使用。注意:这种一般是代码层实现的。
http1.1新验证器
etag是服务器自动生成或者由开发这生成的对应资源在服务端的唯一标识符,能够更加准确的控制缓存
http中缓存种类
协商缓存、强制缓存
强制缓存:当请求某个文件的时候,服务端在respone header中做了缓存配置(缓存时间、缓存类型–这些由服务端控制)
示例1:强制缓存,缓存时间为3600s,代理和浏览器都缓存,客户端刷新时在多少秒内还是读取本地并不发起http请求。
cahe-control:max-age=3600,public,immutable
示例2:强制缓存,缓存时间为3600s,只有客户端缓存(代理nginx不缓存)
cache-control: max-age=3600,private
示例3:强制缓存,缓存时间为3600,如果客户端做刷新操作,就向服务端发起请求。
cahe-control:max-age=3600,public
协商缓存:是基于强制缓存的配置然后去添加协商缓存(一般代码实现)
示例:
开发编写示例:nodejs
res.setHeader(‘max-age’: ‘3600 public’)
res.setHeader(etag: ‘5c20abbd-e2e8’)
res.setHeader(‘last-modified’: Mon, 24 Dec 2018 09:49:49 GMT)
nginx配置示例:
cache-control ‘no-cache’
缓存小技巧
哪些资源去缓存:
URL稳定、
不同地方的图片和其他元素使用同一个库
对于不经常改变的图片/页面启用缓存,通过将cache-control:max-age头信息的值设大一些。
对于定期更新的内容指定max-age或过期时间实现缓存。
如果资源更新了,建议更新其名字—解决页面被缓存其中的连接地址还是旧的问题导致新旧版本冲突问题。
cookie:尽量不用
缓存访问流转图: