首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

indexedDb打开成功,但没有onupgradeneeded事件

indexedDB是一种在浏览器中存储和检索大量结构化数据的API。它提供了一个类似于关系型数据库的方式来组织和访问数据。indexedDB可以在浏览器中创建多个数据库,并且每个数据库可以包含多个对象存储空间,每个对象存储空间可以存储多个数据对象。

在使用indexedDB时,打开数据库成功后,会触发一个叫做"success"的事件,而不是"onupgradeneeded"事件。"success"事件表示数据库已成功打开并准备好进行数据操作。

indexedDB的优势包括:

  1. 客户端存储:indexedDB将数据存储在浏览器中,不需要依赖服务器,可以在离线状态下访问和操作数据。
  2. 大容量存储:indexedDB可以存储大量的数据,没有明确的容量限制。
  3. 高性能:indexedDB使用索引来加速数据检索,可以快速查询和过滤数据。
  4. 事务支持:indexedDB支持事务操作,可以确保数据的一致性和完整性。
  5. 异步操作:indexedDB使用异步API,可以在后台执行数据操作,不会阻塞主线程。

indexedDB适用于需要在浏览器中存储大量结构化数据的应用场景,例如离线应用、数据缓存、日志记录等。

腾讯云提供了一系列与数据库相关的产品,包括云数据库 TencentDB、分布式数据库 TDSQL、数据库缓存 Tendis 等。您可以访问腾讯云官网了解更多产品信息和使用指南。

参考链接:

  • indexedDB官方文档:https://developer.mozilla.org/zh-CN/docs/Web/API/IndexedDB_API
  • 腾讯云数据库产品:https://cloud.tencent.com/product/cdb
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

javascript 操作浏览器数据库IndexedDB

为此,大多数操作以请求的形式执行,这些请求会异步执行,产生成功的结果或错误。绝大多数 IndexedDB 操作要求添加 onerror 和 onsuccess 事件处理程序来确定输出。...5 储存空间大 IndexedDB 的储存空间比 LocalStorage 大得多,一般来说不少于 250MB,甚至没有上限。6 支持二进制储存。...使用 IndexedDB 数据库的第一步是调用 indexedDB.open()方法,并给它传入一个要打开的数据库名称。...测试的时候可以这样做 // 这样会在每次执行事件处理程序时删除已有数据 if (db.objectStoreNames.contains("users")) { db.deleteObjectStore...Firefox 还有一个限制——本地文本不能访问 IndexedDB 数据库。Chrome 没有这个限制。因此在本地运行本书示例时,要使用 Chrome。

7100

JavaScript IndexedDB 完整指南

如果没有存储这些数据的方法,就不可能允许用户交互跨多个 web 应用程序的使用保持状态。...你通常会使用 MySQL、Postgres、MongoDB、Neo4j、ArangoDB 等数据库来处理这些存储,如果你希望应用程序脱机工作呢?...IndexedDB:一个内置在浏览器中的完整文档数据库,没有存储限制,它允许你异步访问数据,这对于防止复杂操作阻塞呈现和其他活动非常有效。这就是我们将在下面深入讨论的内容。...现在让我们用 indexedDB.open("database name", 1) 打开一个数据库。open 的第一个参数是数据库的名称,第二个参数是数据库的版本。...request.onupgradeneeded 事件,当试图打开一个版本号高于数据库当前版本号的数据库时,该事件就会运行。

1.9K20

IndexedDB 基础

目前,没有主流浏览器支持同步 API。 即使同步 API 被支持了,我们通常也会在大多数的情况使用异步 API。 IndexedDB 是 WebSQL 数据库的取代品。...基本模式 IndexedDB 鼓励使用的基本模式如下所示: 打开数据库并且开始一个事务 创建一个 object store 构建一个请求来执行一些数据库操作,像增加或提取数据等 通过监听正确类型的 DOM...事件以等待操作完成 在操作结果上进行一些操作(可以在 request 对象中找到) IndexedDB 的使用 创建一个 IndexedDB 数据库 使用 IndexedDB 的第一步是打开数据库,使用...console.log("连接数据库成功"); } request.onerror = function (event) { console.log("连接数据库失败"); } request.onupgradeneeded...对于第二个参数版本号,则是一个可选参数,如果不传,默认为 1,如果传入就必须是一个整数。

54820

【javascript】谈谈HTML5: Web-Worker、canvas、indexedDB、拖拽事件

前言:作为一名Web开发者,可能你并没有对这个“H5”这个字眼投入太多的关注,实际上它早已不知不觉进入到你的开发中,并且总有一天会让你不得不正视它,了解它并运用它 打个比方:《海贼王》中的主角路飞在“...,则打开已存在的那个数据库 需要说明的是, indexedDB里面绝大多数操作都是异步的, 上述的indexedDB.open并不会立即创建一个数据库, 你需要在异步的回调里面判断数据库是否创建成功,并对可能出现的错误做判断和处理...onerror  创建/打开数据库发生错误的时候调用 onupgradeneeded 数据库版本变化的时候调用 (onupgradeneeded 是我们唯一可以修改数据库结构的地方) open一个indexedDB...people数据存储空间的具体内容,因为现在什么数据都还没添加,所以key和value两列下是没有内容的) 看了上面的代码你可能会有些疑惑 onupgradeneeded 和onsuccess回调的关系是怎样的...要在onupgradeneeded回调中运行 (很显然每次打开都会被调用的onsuccess并不适合用于初始化数据库结构) indexedDB的具体操作 首先说一下,在下面的展示例子中,我们的HTML是这样的

3.1K30

【javascript】谈谈HTML5—Web Worker+canvas+indexedDB+拖拽事件

前言:作为一名Web开发者,可能你并没有对这个“H5”这个字眼投入太多的关注,实际上它早已不知不觉进入到你的开发中,并且总有一天会让你不得不正视它,了解它并运用它 打个比方:《海贼王》中的主角路飞在“...,则打开已存在的那个数据库 需要说明的是, indexedDB里面绝大多数操作都是异步的, 上述的indexedDB.open并不会立即创建一个数据库, 你需要在异步的回调里面判断数据库是否创建成功,并对可能出现的错误做判断和处理...onerror  创建/打开数据库发生错误的时候调用 onupgradeneeded 数据库版本变化的时候调用 (onupgradeneeded 是我们唯一可以修改数据库结构的地方) open一个indexedDB...people数据存储空间的具体内容,因为现在什么数据都还没添加,所以key和value两列下是没有内容的) 看了上面的代码你可能会有些疑惑 onupgradeneeded 和onsuccess回调的关系是怎样的...要在onupgradeneeded回调中运行 (很显然每次打开都会被调用的onsuccess并不适合用于初始化数据库结构) indexedDB的具体操作 首先说一下,在下面的展示例子中,我们的HTML是这样的

3.7K100

IndexedDB使用与出坑指南

我们主要介绍: 数据库操作 数据表操作 数据操作 数据库操作 创建或打开数据库 使用IndexedDB第一步,就是创建或打开一个数据库。...在连接建立成功时,会触发onsuccess事件,其中函数参数event的target属性就是request对象。 而在数据库创建或者版本更新时,会触发onupgradeneeded事件。...此时我们指定一个高于之前版本的版本号,就会触发onupgradeneeded事件。类似的,当此数据库不存在时,也会触发此事件并且将版本更新到置顶版本。...但是,它不能是一个小数,否则它将会被转为最近的整数,同时有可能导致onUpgradeneeded事件不触发(bug)。...; }; 注:只能在onupgradeneeded回调函数中创建存储空间,而不能在数据库打开后的success回调函数中创建。 通过createObjectStore能够创建一个存储空间。

7.8K53

JavaScript IndexedDB 完整指南

如果没有存储这些数据的方法,就不可能允许用户交互跨多个 web 应用程序的使用保持状态。...你通常会使用 MySQL、Postgres、MongoDB、Neo4j、ArangoDB 等数据库来处理这些存储,如果你希望应用程序脱机工作呢?...IndexedDB:一个内置在浏览器中的完整文档数据库,没有存储限制,它允许你异步访问数据,这对于防止复杂操作阻塞呈现和其他活动非常有效。这就是我们将在下面深入讨论的内容。...IndexedDB 是基于事件的,这符合它的异步模型。接下来,让我们看看数据库启动时可能发生的事件。首先,我们将监听request.onerror事件,以防访问数据库时出现任何错误。...request.onupgradeneeded 事件,当试图打开一个版本号高于数据库当前版本号的数据库时,该事件就会运行。

1.5K10

ES6(四)用Promise封装一下IndexedDB 配置文件内部成员建立对象库以及打开数据库初始化对象添加对象修改对象删除对象清空仓库里的对象删除对象仓库删除数据库按主键获取对象,

建立对象库以及打开数据库 // ======== 数据库操作 ================ /** * 打开 indexedDB 数据库。...dbRequest.onerror = (event) => { reject(event) // 返回参数 } }) // 创建表 // 第一次打开成功后或者版本有变化自动执行以下事件...indexedDB 的逻辑是这样的,在open数据库的时候判断本地有没有数据库,如果没有数据库则触发 onupgradeneeded 事件,创建数据库,然后打开数据库。...如果有数据库的话,判断版本号,如果高于本地数据库,那么也会触发 onupgradeneeded 事件。所以open和 onupgradeneeded 就联系在了一起。...,然后判断是否设置了索引查询,没有的话打开仓库的游标,如果设置了,打开索引的游标。

2.1K20

HTML5 学习总结(三)——本地存储(localStorage、sessionStorage、WebSqlDataBase、IndexedDB

IndexedDB是在浏览器中保存结构化数据的一种数据库,为了替换WebSQL(标准已废弃,被广泛支持)而出现。...IndexedDB的操作完全是异步进行的,每一次IndexedDB操作,都需要注册onerror或onsuccess事件处理程序。 <!...的一个重要作用 有了数据库后我们自然希望创建一个表用来存储数据,indexedDB没有表的概念,而是objectStore,一个数据库中可以包含多个objectStore,objectStore是一个灵活的数据结构...如果需要修改或删除数据,就需要打开成读写模式。 2. cursor的非空校验是必要的。 3. 修改或删除的操作也是有onsuccess和onerror的,只是在示例中没有写出来。 4....db = e.target.result; log('创建数据库或打开数据库成功!')

7.4K100

indexedDB 基本使用

:多数情况下使用异步API; 同步API必须同 WebWorkers 一起使用, 目前没有浏览器支持同步API indexedDB 是事务模式的数据库, 使用 key-value 键值对储存数据 indexedDB...它通过索引(index)所产生的指针(cursor)来完成查询操作 一、使用indexedDB的基本模式 打开数据库并且开始一个事务。 创建一个 objecStore。...; }; db.onerror=function(event){ }; console.log('打开数据库成功!')...若是已存在名为DB_NAME的数据库, 则上述代码会打开该数据库; 只触发success/error事件,不会触发upgradeneeded事件. db是对该数据库的引用....,每个存储空间有自己的主键、索引等; 创建对象存储空间的操作一般放在创建数据库成功回调里: request.onupgradeneeded=function(event){// 更新对象存储空间和索引

1.6K100

vue3 专用 indexedDB 封装库,基于Promise告别回调地狱 准备创建数据库的信息直接使用做个“外壳”套个娃

如果没有数据库,或者版本升级: 调用 onupgradeneeded(建立/修改数据库),然后调用 onsuccess。 如果已有数据库,且版本不变,那么直接调用 onsuccess。...* * 如果组件读写 indexedDB 的时还没有准备好的话, * * 可以来注册一个事件,等准备好了之后回调。 */ this....objectStore.createIndex(key2, key2, { unique: unique }) } } } } // 数据库打开成功..._db = event.target.result // dbRequest.result // console.log('【1】成功打开数据库 onsuccess --- ', this....stores 对象仓库的说明,在 onupgradeneeded 事件里面依据这个信息创建对象仓库。 init indexedDB 都准备好之后的回调函数。

1.7K40

indexedDB_INDEX函数

indexedDB介绍 原生介绍 indexedDB 是一个前端数据持久化解决方案(即前端缓存),由浏览器实现。 0. 兼容性 1.特点 基于文件存储。...事件中进行,而onupgradeneeded 事件只在数据库版本升级时触发,所以我们这里版本号升级了。...,而尝试插入一条与已有记录keyPath 相同的记录时,提示失败了,然后我们看数据库: 虽然id为2的数据提示插入成功了,但是数据里并没有,说明因为它之后进行的rs失败了,所以导致事务回滚了,它本来成功的操作也被回滚...,最终数据没有插入进去。...目前只有Firefox(43+)支持,这允许您为索引指定区域设置 示例: const request = window.indexedDB.open('demo', 3); request.onupgradeneeded

99550

IndexedDB 打造靠谱 Web 离线数据库

indexedDB 的整体架构,是由一系列单独的概念串联而成,全部概念如下列表。一眼看去会发现没有任何逻辑,不过,这里我顺手画了一幅逻辑图,中间会根据 函数 的调用而相互串联起来。...新建 Store,并设置 primary Key 设置 index 打开数据库表主要就是版本号和名字,没有太多讲的,我们直接从创建 store 开始吧。...The IndexedDB API 基本上是异步的. IndexedDB 数据库的请求都会包含 onsuccess和onerror事件属性。...如果你打开更新后的版本号的话,还需要监听 onupgradeneeded 事件来实现。最常通过 indexedDB.open 遇见的错误就是 VER_ERR 版本错误。...该部分是 onupgradeneeded 事件获得的 event.target.result 对象: request.onupgradeneeded = function(event) { //

3K30
领券