最新公告
  • 爱每天分享是一家专门做精品资源的网站 下载网站源码、网站模板、游戏源码,尽在爱每天分享!立即加入我们
  • 初窥浏览器数据存储 Cookie、Local Storage、Session Storage、IndexedDB、Web SQL

    初窥浏览器数据存储 Cookie、Local Storage、Session Storage、IndexedDB、Web SQL

    正文概述 程序猿   2020-10-10   59

    随着··· ···,废话就不多铺垫了,直接进入主题吧。浏览器有存储数据的需求,这两天查了下相关文档,重点学习了下。以谷歌浏览器 F12 调出控制台,主要有 Cookie、Local Storage、Session Storage、IndexedDB、Web SQL 几种方案,下面逐一简单说下。

    Cookie

    最早用于 HTTP 状态管理机制,Cookie 通常在 Web 应用程序中用于识别用户及其身份验证的会话,兼容性好。Cookie 是一段不超过 4KB 的小型文本数据,由一个名称(Name)、一个值(Value)和其它几个用于控制 Cookie 有效期、安全性、使用范围的可选属性组成。客户端发起请求时请求头会附带 Cookie 信息,过多的 Cookie 设置会影响请求效率。

    常用方法:

    • document.cookie;
    • document.cookie = ‘key=value’;

    Cookie 的原生 API 不友好,需要自行封装一下。Vue 推荐使用 vue-cookies 插件:

    • import Vue from ‘vue’
    • import VueCookies from ‘vue-cookies’
    • Vue.use(VueCookies)
    • $cookies.config(expireTimes, path)
    • $cookies.set(key, value[, expireTimes[, path[, domain[, secure]]]])
    • $cookies.get(key)
    • $cookies.remove(key [, path [, domain]])
    • $cookies.isKey(key)
    • $cookies.keys()

    参考文档:

    Web Storage

    传统的 Cookie 方式存储数据有诸多限制(数量、大小),然而随着 Web 应用的发展,客户端存储的需求越来越多,为此 HTML5 提出了 Web Storage 的解决方案, Web Storage 包含 Local Storage 及 Session Storage 两种存储机制。

    Local Storage

    Local Storage 永久保留数据,直至手动清除。每个数据源的最大限制为5 MB。

    常用方法:

    • localStorage.length
    • localStorage.setItem(keyName, keyValue);
    • localStorage.getItem(keyName);
    • localStorage.removeItem(keyName);
    • localStorage.key(index);
    • localStorage.clear();
    Session Storage

    Session Storage 浏览器关闭,结束当前会话后自动清除。每个数据源的最大限制为5 MB。

    常用方法:

    • sessionStorage.length
    • sessionStorage.setItem(keyName, keyValue);
    • sessionStorage.getItem(keyName);
    • sessionStorage.removeItem(keyName);
    • sessionStorage.key(index);
    • sessionStorage.clear();

    参考文档:

    IndexedDB

    IndexedDB 类似浏览器的本地数据库,允许储存大量数据,提供查找接口,还能建立索引。

    常用方法:

    • indexedDB.open(databaseName, version);  打开指定版本的数据库
    • IDBEnvironment:提供对IndexedDB功能的访问。它由window和worker对象实现。该接口不是2.0规范的一部分。
    • IDBFactory:提供对数据库的访问。这是由全局对象实现的接口indexedDB ,因此是API的入口点。
    • IDBOpenDBRequest:表示打开数据库的请求。
    • IDBDatabase:表示与数据库的连接。这是在数据库上进行事务处理的唯一方法。
    • IDBTransaction:代表交易。您在数据库上创建事务,指定范围(例如要访问的对象存储),并确定所需的访问类型(只读或读写)。
    • IDBRequest:通用接口,用于处理数据库请求并提供对结果的访问。
    • IDBObjectStore:表示一个对象存储,该对象存储允许访问通过主键查找的IndexedDB数据库中的一组数据。
    • IDBIndex:还允许访问IndexedDB数据库中的数据子集,但使用索引来检索记录而不是主键。有时这比使用快IDBObjectStore。
    • IDBCursor:遍历对象存储和索引。
    • IDBCursorWithValue:遍历对象存储和索引,并返回游标的当前值。
    • IDBKeyRange:定义键范围,该键范围可用于从特定范围的数据库中检索数据。

    参考文档:

    Web SQL

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

    这是··· ···,弃坑了。

    参考文档:

    1.本文部分内容转载自其它媒体,但并不代表本站赞同其观点和对其真实性负责。

    2.若您需要商业运营或用于其他商业活动,请您购买正版授权并合法使用。

    3.如果本站有侵犯、不妥之处的资源,请联系我们。将会第一时间解决!

    4.本站所有内容均由互联网收集整理、网友上传,仅供大家参考、学习,不存在任何商业目的与商业用途。

    5.本站提供的所有资源仅供参考学习使用,版权归原著所有,禁止下载本站资源参与商业和非法行为,请在24小时之内自行删除!


    爱每天分享 » 初窥浏览器数据存储 Cookie、Local Storage、Session Storage、IndexedDB、Web SQL

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。

    发表评论

    售后服务:

    • 售后服务范围 1、商业源码使用范围内问题免费咨询
      2、源码安装、模板安装(一般 ¥50-300)服务答疑仅限SVIP用户
      3、单价超过200元的模板免费一次安装,需提供服务器信息。
      付费增值服务 1、提供dedecms模板、WordPress主题、discuz模板优化等服务请详询在线客服
      2、承接 WordPress、DedeCMS、Discuz 等系统建站、仿站、开发、定制等服务
      3、服务器环境配置(一般 ¥50-300)
      4、网站中毒处理(需额外付费,500元/次/质保三个月)
      售后服务时间 周一至周日(法定节假日除外) 9:00-23:00
      免责声明 本站所提供的源码等资源仅供学习交流,若使用商业用途,请购买正版授权,否则产生的一切后果将由下载用户自行承担,有部分资源为网上收集或仿制而来,若资源侵犯了您的合法权益,请来信通知我们(Email: 572222521@qq.com),我们会及时删除,给您带来的不便,我们深表歉意!

    Hi, 如果你对这款资源有疑问,可以跟我联系哦!

    联系作者

    发表评论

    售后服务:

    • 售后服务范围 1、商业源码使用范围内问题免费咨询
      2、源码安装、模板安装(一般 ¥50-300)服务答疑仅限SVIP用户
      3、单价超过200元的模板免费一次安装,需提供服务器信息。
      付费增值服务 1、提供dedecms模板、WordPress主题、discuz模板优化等服务请详询在线客服
      2、承接 WordPress、DedeCMS、Discuz 等系统建站、仿站、开发、定制等服务
      3、服务器环境配置(一般 ¥50-300)
      4、网站中毒处理(需额外付费,500元/次/质保三个月)
      售后服务时间 周一至周日(法定节假日除外) 9:00-23:00
      免责声明 本站所提供的源码等资源仅供学习交流,若使用商业用途,请购买正版授权,否则产生的一切后果将由下载用户自行承担,有部分资源为网上收集或仿制而来,若资源侵犯了您的合法权益,请来信通知我们(Email: 572222521@qq.com),我们会及时删除,给您带来的不便,我们深表歉意!

    Hi, 如果你对这款资源有疑问,可以跟我联系哦!

    联系作者
    • 35554会员总数(位)
    • 1236资源总数(个)
    • 25本周发布(个)
    • 0 今日发布(个)
    • 206稳定运行(天)

    找源码就上爱每天分享Aimeit.com

    开通SVIP 源码推荐
    开通VIP 享更多特权,所有资源任意下载!