HTTP header 缓存工作原理
- 浏览器发起请求的时候,根据请求头的
express
和cache-control
来判断是否命中强缓存,如果是,怎直接从缓存读取资源,不会发起请求。 - 如果没有命中强缓存,浏览器会发起一个请求到服务端,并通过
last-modified
If-modified-since
和etag
if-none-match
判断资源是否命中协商缓存,如果命中, 不会 中断请求,服务器会将这个请求返回(304),但是不会返回资源,资源会从缓存中读取。 - 如果没有命中缓存,则发起请求,直接从服务器加载资源。
1 | <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> |
数据缓存
- cookie:4kb,可以手动设置过期时间
- localStorage:5M,不手动清除一直存在,可以跨标签访问
- sessionStorage:5M,不可以跨标签访问,窗口回话结束自己清除
- indexDB:浏览器数据库,无限容量,除非手动清除,否则一直存在
webSQL:关系数据库,废弃