关于javascript:前端存储方案一览

11次阅读

共计 1143 个字符,预计需要花费 3 分钟才能阅读完成。

Cookies

在 HTML5 规范前本地贮存的次要的也是最早提出的⽅式,长处是兼容性好,申请头⾃带 cookie ⽅便(应用 fetch 的话须要额定配置),毛病是⼤⼩只有 4k,⾃动申请头加⼊ cookie 节约流量,而且每个 domain 限度 20 个 cookie,使⽤起来麻烦,须要自行封装相干办法。

  • Cookie 一旦创立胜利,名称就无奈批改
  • Cookie 是无奈跨域名的,然而子域名之间共享
  • 有平安问题,如果 Cookie 被拦挡了,那就可取得 session 的所有信息,预防形式包含设置 httpOnly
  • Cookie 在申请一个新的页面的时候都会被发送过来

跨域名共享计划:

  • Nginx 反向代理
  • 单个站点登入后,通过 setCookie 的形式,在其余网站上写上 Cookie,同时服务端的 Session 应用同一个节点

LocalStorage

HTML5 加⼊的以键值对 (Key-Value) 为规范的⽅式,长处是操作⽅便,永久性贮存(除⾮⼿动删除),⼤⼩为 5M,兼容 IE8+。

如果浏览器设置为隐衷模式,那咱们将无奈读取到 LocalStorage,同时受到同源策略的限度,非同源页面无法访问。

SessionStorage

与 LocalStorage 根本相似,区别是 SessionStorage 当⻚⾯敞开后会被清理,⽽且与 cookie、LocalStorage 不同,其次要用于长期保留同一窗口 (或标签页) 的数据,刷新页面时不会删除,敞开窗口或标签页之后将会删除这些数据。

Web SQL

2010 年被 W3C废除 的本地数据库数据存储⽅案,然而支流浏览器(⽕狐除外)都曾经有了相干的实现,Web SQL 相似于 SQLite,是真正意义上的关系型数据库。Web SQL 数据库 API 并不是 HTML5 标准的一部分,然而它是一个独立的标准,引入了一组应用 SQL 操作客户端数据库的 APIs。

Beware. This specification is no longer in active maintenance and the Web Applications Working Group does not intend to maintain it further.

本文档是 2010 年 11 月 18 日 Web SQL 数据库工作组的阐明。作为工作组阐明公布并不意味着失去 W3C 成员的认可。这是一份草稿文件,可能随时被其余文件更新、替换或废止。除了正在进行的工作之外,援用本文件是不失当的。W3C Web 应用程序工作组是负责本文档的 W3C 工作组。

IndexedDB

IndexedDB 是一种底层 API,用于在客户端存储大量的结构化数据(也包含文件 / 二进制大型对象(blobs))。其是被正式纳⼊ HTML5 规范的数据库贮存⽅案,它是 NoSQL 数据库,⽤键值对进⾏贮存。

  • 键值对贮存
  • 异步
  • 反对事务
  • 同源限度
  • 贮存空间大
  • 反对二进制贮存
正文完
 0