H5缓存机制原理分析
浏览器缓存机制是指通过HTTP协议头里的Cache-Control
(或Expires
)和Last-Modified
(或Etag
)等字段来控制文件缓存的机制。
Cache-Control
用于控制文件在本地缓存有效时长。比如服务器回包:Cache-Control:max-age=600
表示文件在本地应该缓存,且有效时长是600秒(从发出请求算起)。在接下来600秒内,如果有请求这个资源,浏览器不会发出 HTTP
请求,而是直接使用本地缓存的文件。
Last-Modified
是标识文件在服务器上的最新更新时间。下次请求时,如果文件缓存过期,浏览器通过 If-Modified-Since
字段带上这个时间,发送给服务器,由服务器比较时间戳来判断文件是否有修改。如果没有修改,服务器返回304告诉浏览器继续使用缓存;如果有修改,则返回200,同时返回最新的文件。