web存储 | Cookie、Web Storage API（localStorage、sessionStorage）、IndexedDB

参考博客
MDN Web Storage API

• HTTP Cookie

Web Storage API 大小限制 各个浏览器限定不同 2.5M-5M-10M 甚至 50M

检查浏览器是否支持DOM存储

function storageSupport() {
  try {
      return 'localStorage' in window && window['localStorage'] !== null;
  } catch (e) {
      return false;
  }
}

• localStorage 里面存储的数据没有过期时间设置，
• sessionStorage 里面的数据在页面会话结束（浏览器关闭）时会被清除。

调用接口会创建 Storage 对象
Storage 的属性方法：

属性方法	作用
getItem(key)	获得指定 key 存储的值
setItem(key, value)	设置键值对
removeItem(key)	删除 key 对应的键值对
key(index)	返回列表中对应所有的 key
length()	返回键值对列表长度
clear()	清空所有键值对

新打开的标签页会复制父级的 sessionStorage，类似于深拷贝，之后 sessionStorage 的变更不会同步。

打开多个相同的 URL 的 Tabs 页面，会创建各自的 sessionStorage。

IndexedDB

大小无限制
不仅可以储存字符串，还可以储存二进制数据（ArrayBuffer 对象和 Blob 对象）

虽然 Web Storage 在存储较少量的数据很有用，但对于存储更大量的结构化数据来说力不从心。

对 IndexedDB 进行封装的库 localForage、dexie.js、PouchDB、idb、idb-keyval、JsStore 或者 lovefield 等

调用 open() 方法。该方法返回一个 IDBRequest 对象