当前位置: 首页 > news >正文

IndexedDB

IndexedDB是一个功能强大且高度灵活的存储系统,你可以使用它在用户浏览器中存储你希望存储的任何数据。不过,出色的功能和灵活性致使其API不像Web存储那么友好。你还会发现,移动端浏览器对IndexedDB的支持还不是很友好,即使支持。

IndexedDB关键术语

数据库

IndexedDB的最上层是数据库的概念。

对象存储

对象存储相当于保存数据的桶。如果你使用过传统的关系型数据库,则可以将对象存储想象成一张表。但是IndexedDB可以更灵活地存储数据。

索引

索引是一种从对象存储中检索数据的方式。

使用数据库

创建数据库时,需要提供一个名称和版本。数据库结构(指对象存储和索引,而不是实际数据本身)只能在更改版本时临时调整。
在IndexDB中,你所做的所有操作都是异步的。因此,打开数据库并不意味着立即就可以使用,而是需要在响应一个事件之后才可以使用。打开数据库操作可以触发的事件包括success、error、upgradeneeded和blocked.
其中upgradeneeded在用户首次访问数据库或者版本号发生变化时出发,这是设置数据结构的地方。bloced在数据库不可用或者无法使用时被触发。

function idbOK(){
    return "indexedDB" in window;
}
$(documengt).ready(function() {
    if(!idbOK) return;
    var openRequest = indexedDB.open("ora_idb1", 1);
    openRequest.onsuccess = function(e) {
        var db = e.target.result;
    }
});

上述代码中,首先检查浏览器是否支持IndexedDB。如果支持,则使用indexedDB.open方法打开数据库。第一个参数是数据库名称。由于一个IndexedDB数据库只提供给一个网站使用,因此不用担心该名称和其他数据库的名称相冲突。

使用对象存储

前面说过,indexedDB对象存储有点像SQL数据库表。它应该只包含一种“类型”的数据,比如"people""notes"或其他对象的实例。其思想是每个需要持久化的数据类型都有一个对象存储。
对象存储只能在upgradeneeded事件处理期间创建。假设你设计的数据库支持两种对象存储。数据之后,你又决定存户第三种类型的数据。你需要做两件事:第一,更改版本号;第二,编写代码,增加新的对象存储。

创建对象存储

要创建对象存储,首先应该检查它是否存在。可以利用数据库变量(从打开数据库操作的事件处理器获得)访问objectStoreNames属性。该属性是一个DOMStringList实例,你可以查看它是否已经包含了某个值。如果没有,则可以调用createObjectStore("name", options)方法创建对象存储。

openRequest.onupgradeneeded = function(e) {
    var thisDB = e.target.result;
    if(!thisDB.objectStoreNames.contains("firstOS")) {
        thisDB.createObjectStore("firstOS");
    }
}

定义主键

在对象存储中,每条数据都必须有一种能够唯一标识自己的方式。在定义对象存储时,你可以定义如何唯一地标识数据。
实际上,主要有两种定义方式。一种是定义一个key path,它本质上是一个永远存在并且包含唯一信息的属性。另一种是使用key generator,它本质上是一种生成唯一值的方式。

相关文章:

  • pl/sql 笔记之存储过程、函数、包、触发器(下)
  • mysql的库和表相关操作
  • Exchange 2010升级sp2报错
  • 【Cocosd2d-x CCMenu菜单之二】
  • ISO8583开发注意事项和心得体会
  • iOS 相册和网络图片的存取
  • beanshell获取响应结果数据
  • XYGame-网络同步3-防作弊
  • 红黑树 - C++代码实现
  • 自己定义iOS上双击Home键图切换
  • 数据预测的步骤
  • Elasticsearch学习笔记-04.2删除文档
  • 磁珠与电感的区别,看了就灰常明白了
  • Spring Quartz 集群动态创建任务
  • 考试题解集合
  • 【5+】跨webview多页面 触发事件(二)
  • Android单元测试 - 几个重要问题
  • CentOS 7 防火墙操作
  • CSS盒模型深入
  • ECS应用管理最佳实践
  • Fabric架构演变之路
  • Golang-长连接-状态推送
  • Java 23种设计模式 之单例模式 7种实现方式
  • Laravel 实践之路: 数据库迁移与数据填充
  • LeetCode算法系列_0891_子序列宽度之和
  • Making An Indicator With Pure CSS
  • Node + FFmpeg 实现Canvas动画导出视频
  • PHP 小技巧
  • React Native移动开发实战-3-实现页面间的数据传递
  • React16时代,该用什么姿势写 React ?
  • Redis学习笔记 - pipline(流水线、管道)
  • session共享问题解决方案
  • SpringCloud(第 039 篇)链接Mysql数据库,通过JpaRepository编写数据库访问
  • vue和cordova项目整合打包,并实现vue调用android的相机的demo
  • 技术胖1-4季视频复习— (看视频笔记)
  • 使用docker-compose进行多节点部署
  • 测评:对于写作的人来说,Markdown是你最好的朋友 ...
  • (003)SlickEdit Unity的补全
  • (DenseNet)Densely Connected Convolutional Networks--Gao Huang
  • (ibm)Java 语言的 XPath API
  • (九)One-Wire总线-DS18B20
  • .NET Standard 的管理策略
  • .net中应用SQL缓存(实例使用)
  • .sh文件怎么运行_创建优化的Go镜像文件以及踩过的坑
  • .xml 下拉列表_RecyclerView嵌套recyclerview实现二级下拉列表,包含自定义IOS对话框...
  • .考试倒计时43天!来提分啦!
  • @EnableConfigurationProperties注解使用
  • @FeignClient注解,fallback和fallbackFactory
  • [120_移动开发Android]008_android开发之Pull操作xml文件
  • [AutoSar]BSW_Memory_Stack_003 NVM与APP的显式和隐式同步
  • [C++] cout、wcout无法正常输出中文字符问题的深入调查(1):各种编译器测试
  • [Electron] 将应用打包成供Ubuntu、Debian平台下安装的deb包
  • [java] 23种设计模式之责任链模式
  • [Java] IDEA Scala环境搭建
  • [k8s系列]:kubernetes·概念入门