Cookie、LocalStorage、SessionStorage 的区别

Cookie

1. 一般由服务器生成，可设置失效时间，如果在浏览器端生成cookie，默认是关闭后失效。
2. 存放数据 4Kb
3. 每次都会携带HTTP头中，如果使用cookie保存过多数据会带来性能问题

document.cookie="username=isLogin; expires=Thu, 18 Dec 2043 12:00:00 GMT";// 储存 ( 名称、时间 )
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";// 删除 您只需要设置 expires 参数为以前的时间即可
var str = document.cookie;// 获取 （将获取所有cookie）

 

LocalStorage

1. 除非手动清除，否则永久保存
2. 存放数据 5Mb
3. 仅在 浏览器 中保存，不参与和服务器的通信

localStorage.setItem('Login', JSON.stringify(res.data.content))// 储存 ( 名称、内容 )
localStorage.removeItem('Login')// 删除 ( 名称 )
var obj = JSON.parse(localStorage.getItem('Login'))// 获取 ( 名称 )

 

SessionStorage 

1. 仅在当前会话会有效，关闭页面或浏览器后被清除
2. 存放数据 5Mb
3. 仅在 浏览器 中保存，不参与和服务器的通信

sessionStorage.setItem('key','这是一个测试的value值')// 储存 （名称、内容）
sessionStorage.removeItem("key")// 删除 （名称）
var str = sessionStorage.getItem("key")// 获取 （名称）