本地存储

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. 浏览器关闭后消失

推荐阅读更多精彩内容

  • 三种本地存储方式 cookie 前言 网络早期最大的问题之一是如何管理状态。简而言之,服务器无法知道两个请求是否来...
    流动码文阅读 3,106评论 0 2
  • 前言 总括:详细讲述Cookie,LocalStorge,SesstionStorge的区别和用法。 人生如画,岁...
    秦至阅读 1,054评论 0 34
  • 本文介绍本地数据存储的选型。简单总结一些查询到的关于本地数据存储的技术。 控制台展示前端存储 Chrome: 前端...
    谢大见阅读 7,280评论 1 7
  • 有意无意地,都已经被微信、电视剧、游戏等充满了仅有的班后时间,于是所有的想法均来自外界、所有交际都产生于虚拟世界,...
    九天林林阅读 333评论 0 0
  • 中国业已进入“男盈女亏”的时代,危害不亚于上世纪中叶的人口膨胀。适龄男人已经面临“讨婆娘难”,其直接影响婚姻梯度挤...
    欧阳小川阅读 227评论 4 8
  • 早上4点半天还黑蒙蒙的,我们就起床,准备去北岐观看日出。我还从来没有看过海上日出呢!所以十分地兴高采烈,对日出表现...
    我就是那么吊阅读 53评论 0 0
  • 01 早就看上书里的这款小粉裙,果然不负众望,小公主诞生啦~ 14年的双十一在坐月子,囤了适合织这款小裙子的细棉线...
    NataliaB阅读 393评论 8 5