几种存储方式的用法（cookie session localStorage sessionStorage）

 

本地存储分为cookie，以及新增的localStorage和sessionStorage

1、cookie 存储在本地，容量最大4k，在同源的http请求时携带传递，

损耗带宽，可设置访问路径，生命周期以毫秒计算；

只有此路径及此路径的子路径才能访问此cookie，在设置的过期时间之前有效。

2、localStorage 存储在本地，容量为5M或者更大，

不会在请求时候携带传递，在所有同源窗口中共享，

数据一直有效，除非人为删除，可作为长期数据。

3、sessionStorage 存储在本地，容量为5M或者更大，

不会在请求时候携带传递，在同源的当前窗口关闭前有效。

//cookie:   用户端保存请求信息的机制  分号分隔的多个key-value字段  存储在本地的加密文件里边
//name:cookie名称
//domain:cookie生效的域名
//path:cookie生效的路径
//expires:cookie的过期时间
//HttpOnly:用户端不可更改
// 查看cookie


//session:服务端保存请求信息的机制   sessionId通常存放在cookie当中   会话由浏览器控制 会话结束 session失效

document.cookie

// 添加cookie
document.cookie = 'name=Rosen;domain=happymmall.com;path=/index.html;expires=Sat, 06 Jan 2019 13:38:45 GMT'

// 修改cookie
document.cookie = 'name=Rosen1;domain=happymmall.com;path=/index.html;'

// 删除cookie
document.cookie = 'name=Rosen1;domain=happymmall.com;path=/index.html;expires=Sat, 06 Jan 2017 13:38:45 GMT'

// 添加localStorage
window.localStorage.setItem('name', 'Rosen');

// 查看localStorage
window.localStorage.getItem('name');

// 删除localStorage
window.localStorage.removeItem('name');


// 添加sessionStorage
window.sessionStorage.setItem('name', 'Rosen');

// 查看sessionStorage
window.sessionStorage.getItem('name');

// 删除sessionStorage
window.sessionStorage.removeItem('name');