Javascript本地存储

javaScript 本地缓存的⽅法我们主要讲述以下四种：

•

cookie

•

Cookie ，类型为「⼩型⽂本⽂件」，指某些⽹站为了辨别⽤⼾⾝份⽽储存在⽤⼾本地终端上的数

据。是为了解决 HTTP ⽆状态导致的问题

作为⼀段⼀般不超过 4KB 的⼩型⽂本数据，它由⼀个名称（Name）、⼀个值（Value）和其它⼏个⽤

于控制 cookie 有效期、安全性、使⽤范围的可选属性组成

但是 cookie 在每次请求中都会被发送，如果不使⽤ HTTPS 并对其加密，其保存的信息很容易被窃

取，导致安全⻛险。举个例⼦，在⼀些使⽤ cookie 保持登录态的⽹站上，如果 cookie 被窃取，

他⼈很容易利⽤你的 cookie 来假扮成你登录⽹站

sessionStorage

sessionStorage 和 localStorage 使⽤⽅法基本⼀致，唯⼀不同的是⽣命周期，⼀旦⻚⾯

（会话）关闭， sessionStorage 将会删除数据

localStorage

⽣命周期：持久化的本地存储，除⾮主动删除数据，否则数据是永远不会过期的

存储的信息在同⼀域中是共享的

当本⻚操作（新增、修改、删除）了 localStorage 的时候，本⻚⾯不会触发 storage 事件,

但是别的⻚⾯会触发 storage 事件。

关于 cookie 、 sessionStorage 、 localStorage 三者的区别主要如下：

•

存储⼤⼩： cookie 数据⼤⼩不能超过 4k ， sessionStorage 和 localStorage 虽然也有

存储⼤⼩的限制，但⽐ cookie ⼤得多，可以达到5M或更⼤

•

有效时间： localStorage 存储持久数据，浏览器关闭后数据不丢失除⾮主动删除数据；

sessionStorage 数据在当前浏览器窗⼝关闭后⾃动删除； cookie 设置的 cookie 过期时

间之前⼀直有效，即使窗⼝或浏览器关闭•

数据与服务器之间的交互⽅式， cookie 的数据会⾃动的传递到服务器，服务器端也可以写

cookie 到客⼾端； sessionStorage 和 localStorage 不会⾃动把数据发给服务器，仅

在本地保存