本地存储

cookie

1. 用户端保存请求信息的机制
2. 分号分隔的多个key-value字段
3. 存储在本地的加密文件里
4. 域名和路径的限制

name: cookie的名称
domain: cookie生效的域名
path: cookie生效的路径
expires: cookie过期时间
HttpOnly: 用户端不可更改

// 查看cookie
document.cookie
// 添加cookie 
document.cookie = 'name=viiv;domain=viivmall.viivlgr.cn;path=/index.html;expires=Wed, 02 May 2019 09:38:46 GMT'
// 修改cookie
document.cookie = 'name=seek;domain=viivmall.viivlgr.cn;path=/index.html;'
// 删除cookie,把过期时间设置成之前的日期或0
document.cookie = 'name=seek;domain=viivmall.viivlgr.cn;path=/index.html;expires=Wed, 02 May 2018 09:38:46 GMT'

session

1. 服务端保存请求信息的机制
2. sessionId通常存放在cookie里
3. 会话由浏览器控制，会话结束，session失效

localStorage

1. H5新特性
2. 有域名限制，不存在作用域概念
3. 只有key-value，value只能是基础类型
4. 没有过期时间
5. 浏览器关闭后不消失

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

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

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

// 获取localStorage对象
window.localStorage

// 存储对象需要先进行json序列化
window.localStorage.setItem('name', JSON.stringify({name: 'viiv'}));

sessionStorage

1. 和localstorage极其相似
2. 浏览器关闭后消失