H5本地存储技术

sessionStorage（会话存储）

会话：浏览器标签从打开到关闭的一个过程

• sessionStorage的生命周期：浏览器打开到关闭的过程
• sessionStorage的大小：5MB —— 单个域名下的sessionSorage存储空间的总大小限制
• sessionStorage的保存位置：浏览器端
• sessionStorage的作用域：sessionStorage的作用域是同域策略+同一个窗口，子域名可共享。这意味着不同窗口或标签页打开的同一域名（相同的协议、主机名、端口号）下的页面，它们各自拥有独立的 sessionStorage 存储空间，彼此间无法共享 sessionStorage 中的数据。
• sessionStorage的方法:

//存储数据
sessionStorage.setItem('key',value)
//获取数据
sessionStorage.getItem('key')
//删除数据
sessionStorage.removeItem('key')
//清空localStorage数据
sessionStorage.clear()

localStorage（永久存储）

• localStorage的生命周期：永久除非人为删除
• localStorage的大小：5MB —— 单个域名下的localStorage存储空间的总大小限制
• localStorage的保存位置：浏览器端
• localStorage的作用域：localStorage 的作用域是 同源策略，子域名可共享。这意味着只要是在相同协议（http/https）、相同主机名和相同端口号下的页面，都可以访问同一份 localStorage 数据，但是不同浏览器之间还是隔离的。（同一个浏览器中的相同页面的localtorage是相同的，不同浏览器中的相同页面的localtorage是不同的）
• localStorage的方法:

//存储数据
localStorage.setItem('key',value)
//获取数据
localStorage.getItem('key')
//删除数据
localStorage.removeItem('key')
//清空localStorage数据
localStorage.clear()

浏览器查看：

cookie

作用： cookie用于浏览器和服务器端进行通信，cookie存储了用户的浏览记录。
特点∶

• 大小:4kb —— 是对一条cookie信息的限制， 对单个域名下的cookie存储空间的总大小限制和浏览器有关 几十到击败KB 不等。
• 每次发送请求都携带。导致占用带宽
• cookie的保存位置：保存在浏览器端
• cookie的作用域：和localStorage一样 cookie 的作用域是 同源策略，子域名的共享可配置。默认情况下所有的子域名可以共享，但是可以通过Path属性限定其在特定路径下生效。
• cookie容易被截获，不安全
• cookie的生命周期：
  • 会话cookie：浏览器打开到关闭的过程
  • 人为设置cookie：人为设置的时间