前端基础整理【缓存 强缓存 协商缓存】

Cookie

HTTP协议是无状态的，每次请求完全独立，不利于交互式web应用的实现（登录状态、购物车等等）

Cookie是由服务器发送到用户浏览器，并保存在本地的一块数据，在浏览器下一次向同一服务器发送请求时会被携带发送。

Cookie由浏览器作为文本存储在安装目录的Cookie文件夹中：

• 缓存业务数据（登录、购物车等业务信息）
• 用户个性化设置，如网页的字体背景设定
• 追踪和分析用户行为

Cookie用于保证状态的存储，而客户端数据的存储应当考虑localStorage、sessionStorage，因为Cookie容量小）、缺少数据操作接口、影响请求性能。

一般超出大小的cookie会被浏览器忽略、删除，影响请求性能；单个域的Cookie不应超过50个，每个大小小于4kb

• localStorage在HTML5中出现，在IE6以下使用usedata兼容；除非手动清除否则永久保存。
• sessionStorage在窗口刷新时不会消失，生命周期在窗口关闭时结束。
• 二者大小均在5M左右，不参与服务器通信

IndexDB：浏览器的本地数据库，允许JS创建与操作，提供大量数据的存储，提供查找接口，可建立索引，为非关系型数据库。键值对存储，异步设计防止大量读写拖慢网页表现，受同源限制，可存储二进制数据。

本域设置的cookie只可被自身和子域读取，指定路径的cookie同理，不可跨域或读取子集的cookie内容。

cookie默认为浏览器关闭时销毁，可手动设置过期时间。

• name、value： 设置名称与对应值
• domain：可访问cookie的站点或域，默认值当前域名
• path：主机的哪些路径可访问cookie，默认值当前网页所在目录
• expires、max-age：Expires规定cookie的到期时间，Max-Age规定从当前开始的存在秒数。此值缺省时，cookie为会话性，仅在客户端内存中保存；当过期时间设定后，仅与客户端时间有关，与服务器无关。
• httponly：是否可通过JavaScript访问，默认为空（可访问）
• secure：使用HTTPS安全协议发送cookie，若当前站点协议为http则忽略此条
• samesite：要求该cookie在跨站请求中不被携带，即，保证跨站请求伪造攻击无法携带cookie用户信息，阻止csrf。有三个值：none（大小写无关，跨站请求继续携带cookie）、Strict（只在访问相同站点时发送）、Lax（与strict相同，但排除外部站点导航（链接）的情况，大多数主流浏览器都将使用Lax替换none作为samesite的默认值）

缓存