diff options
Diffstat (limited to 'files/zh-cn/web/api/indexeddb_api/index.html')
-rw-r--r-- | files/zh-cn/web/api/indexeddb_api/index.html | 155 |
1 files changed, 155 insertions, 0 deletions
diff --git a/files/zh-cn/web/api/indexeddb_api/index.html b/files/zh-cn/web/api/indexeddb_api/index.html new file mode 100644 index 0000000000..ca8c7791b1 --- /dev/null +++ b/files/zh-cn/web/api/indexeddb_api/index.html @@ -0,0 +1,155 @@ +--- +title: IndexedDB +slug: Web/API/IndexedDB_API +tags: + - IndexedDB + - IndexedDB API + - Object Storage + - Workers + - localforage +translation_of: Web/API/IndexedDB_API +--- +<p>{{DefaultAPISidebar("IndexedDB")}}</p> + +<p>IndexedDB 是一种底层 API,用于在客户端存储大量的结构化数据(也包括文件/二进制大型对象(blobs))。该 API 使用索引实现对数据的高性能搜索。虽然 <a href="/zh-CN/docs/Web/API/Web_Storage_API" title="en-US/docs/DOM/Storage">Web Storage</a> 在存储较少量的数据很有用,但对于存储更大量的结构化数据来说力不从心。而 IndexedDB 提供了这种场景的解决方案。本页面 MDN IndexedDB 的主要引导页 - 这里,我们提供了完整的 API 参考和使用指南,浏览器支持细节,以及关键概念的一些解释的链接。</p> + +<p>{{AvailableInWorkers}}</p> + +<div class="note"> +<p><strong>注意</strong>:IndexedDB API是强大的,但对于简单的情况可能看起来太复杂。如果你更喜欢一个简单的API,请尝试 <a href="https://localforage.github.io/localForage/">localForage</a>、<a href="http://www.dexie.org/">dexie.js</a>、<a href="https://pouchdb.com/">PouchDB</a>、<a href="https://www.npmjs.com/package/idb">idb</a>、<a href="https://www.npmjs.com/package/idb-keyval">idb-keyval</a>、<a href="https://jsstore.net/">JsStore</a> 或者 <a href="https://github.com/google/lovefield">lovefield</a> 之类的库,这些库使 IndexedDB 对开发者来说更加友好。</p> +</div> + +<h2 id="关键概念和用法">关键概念和用法</h2> + +<p>IndexedDB 是一个事务型数据库系统,类似于基于 SQL 的 RDBMS。 然而,不像 RDBMS 使用固定列表,IndexedDB 是一个基于 JavaScript 的面向对象数据库。IndexedDB 允许您存储和检索用<strong>键</strong>索引的对象;可以存储<a href="https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/The_structured_clone_algorithm">结构化克隆算法</a>支持的任何对象。您只需要指定数据库模式,打开与数据库的连接,然后检索和更新一系列<strong>事务</strong>。</p> + +<ul> + <li>阅读更多关于 <a href="https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB">IndexedDB背后的概念</a>。</li> + <li>从<a href="/zh-CN/docs/Web/API/IndexedDB_API/Using_IndexedDB">使用 IndexedDB</a> 指南的第一准则中学习异步使用 IndexedDB。</li> + <li>同时使用 IndexedDB 储存离线数据和 Service Workers 储存离线资源,其简述请查看 <a href="/zh-CN/docs/Web/Progressive_web_apps/Offline_Service_workers">Service Workers 制作离线 PWA</a>。</li> +</ul> + +<div class="note"> +<p>注意: 正如大多数的 web 储存解决方案一样,IndexedDB 也遵守<a href="/zh-CN/docs/Web/Security/Same-origin_policy">同源策略</a>。因此当你在某个域名下操作储存数据的时候,你不能操作其他域名下的数据。</p> +</div> + +<h3 id="同步和异步(Synchronous、asynchronous)">同步和异步(Synchronous、asynchronous)</h3> + +<p>使用 IndexedDB 执行的操作是异步执行的,以免阻塞应用程序。IndexedDB 最初包括同步和异步 API。同步 API 仅用于 <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Performance/Using_web_workers">Web Workers</a>,且已从规范中移除,因为尚不清晰是否需要。但如果 Web 开发人员有足够的需求,可以重新引入同步 API。</p> + +<h3 id="储存限制和回收标准">储存限制和回收标准</h3> + +<p>有许多 Web 技术在客户端(即本地磁盘)存储各种数据。IndexedDB 是最常见的一个。浏览器计算分配给 Web 数据存储的空间以及达到该限制时要删除的内容的过程并不简单,并且在浏览器之间有所不同。<a href="/zh-CN/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria">浏览器存储限制和回收标准</a>尝试解释这是如何工作的,至少在火狐的情况下是如此。</p> + +<h2 id="接口">接口</h2> + +<p>为了获取数据库的访问权限,需要在 <a href="/zh-CN/docs/Web/DOM/Window">window</a> 对象的 <a href="/zh-CN/docs/Web/API/IDBEnvironment.indexedDB">indexedDB</a> 属性上调用 <a href="/zh-CN/docs/Web/API/IDBFactory.open">open()</a> 方法。该方法返回一个 {{domxref("IDBRequest")}} 对象;异步操作通过在 {{domxref("IDBRequest")}} 对象上触发事件来和调用程序进行通信。</p> + +<h3 id="连接数据库">连接数据库</h3> + +<dl> + <dt>{{domxref("IDBEnvironment")}}</dt> + <dd>提供 IndexedDB 功能。它由 {{domxref("window")}} 和 {{domxref("worker")}} 实现,这个接口不再是 2.0 规范的一部分。</dd> + <dt>{{domxref("IDBFactory")}}</dt> + <dd>提供数据库访问。这是全局对象 {{domxref("WindowOrWorkerGlobalScope/indexedDB", "indexedDB")}} 实现的接口,因此是 API 的入口。</dd> + <dt>{{domxref("IDBOpenDBRequest")}}</dt> + <dd>表示一个打开数据库的请求。</dd> + <dt>{{domxref("IDBDatabase")}}</dt> + <dd>表示一个数据库连接。这是在数据库中获取事务的唯一方式。</dd> + <dt> + <h3 id="接收和修改数据">接收和修改数据</h3> + </dt> + <dt>{{domxref("IDBTransaction")}}</dt> + <dd>表示一个事务。在数据库上创建一个事务,指定作用域(例如要访问的存储对象),并确定所需的访问类型(只读或读写)。</dd> + <dt>{{domxref("IDBRequest")}}</dt> + <dd>处理数据库请求并提供对结果访问的通用接口。</dd> + <dt>{{domxref("IDBObjectStore")}}</dt> + <dd>表示允许访问通过主键查找的 IndexedDB 数据库中的一组数据的对象存储区。</dd> + <dt>{{domxref("IDBIndex")}}</dt> + <dd><font><font>也是为了允许访问 IndexedDB 数据库中的数据子集,但使用索引来检索记录而不是主键。</font><font>这有时比使用 </font></font><a href="/zh-CN/docs/Web/API/IDBObjectStore">IDBObjectStore</a> 更快<font><font>。</font></font></dd> + <dt>{{domxref("IDBCursor")}}</dt> + <dd>迭代对象存储和索引。</dd> + <dt>{{domxref("IDBCursorWithValue")}}</dt> + <dd>迭代对象存储和索引并返回游标的当前值。</dd> + <dt>{{domxref("IDBKeyRange")}}</dt> + <dd>定义可用于从特定范围内的数据库检索数据的键范围。</dd> + <dt>{{domxref("IDBLocaleAwareKeyRange")}} {{Non-standard_inline}}</dt> + <dd>定义一个键范围,可用于从特定范围内的数据库中检索数据,并根据为特定索引指定的语言环境的规则进行排序(详见 <a href="/zh-CN/docs/Web/API/IDBObjectStore/createIndex#Parameters">createIndex()</a> 的参数)。这个接口不再是 2.0 规范的一部分。</dd> + <dt> + <h3 id="自定义事件接口">自定义事件接口</h3> + + <p>此规范使用以下自定义接口触发事件:</p> + </dt> + <dt>{{domxref("IDBVersionChangeEvent")}}</dt> + <dd>作为 {{domxref("IDBOpenDBRequest.onupgradeneeded")}} 事件的处理程序的结果,<code>IDBVersionChangeEvent </code>接口表示数据库的版本已经发生了改变。</dd> + <dt> + <h3 id="过时的接口">过时的接口</h3> + + <p><font>规范的早期版本还定义了这些现在已删除的接口。这些文档便于您需要更新以前编写的代码</font>:</p> + </dt> + <dt>{{domxref("IDBVersionChangeRequest")}} {{obsolete_inline}}</dt> + <dd><font>表示更改数据库版本的请求。改变数据库版本的方法已经改变了(通过调用</font>{{domxref("IDBFactory.open")}} 而非{{domxref("IDBDatabase.setVersion")}}),接口{{domxref("IDBOpenDBRequest")}} 现在拥有{{domxref("IDBVersionChangeRequest")}}。</dd> + <dt>{{domxref("IDBDatabaseException")}} {{obsolete_inline}}</dt> + <dd>表示执行数据库操作时可能遇到的异常情况。</dd> + <dt>{{domxref("IDBTransactionSync")}} {{obsolete_inline}}</dt> + <dd>同步版本的 {{domxref("IDBTransaction")}}。</dd> + <dt>{{domxref("IDBObjectStoreSync")}} {{obsolete_inline}}</dt> + <dd>同步版本的 {{domxref("IDBObjectStore")}}。</dd> + <dt>{{domxref("IDBIndexSync")}} {{obsolete_inline}}</dt> + <dd>同步版本的 {{domxref("IDBIndex")}}。</dd> + <dt>{{domxref("IDBFactorySync")}} {{obsolete_inline}}</dt> + <dd>同步版本的 {{domxref("IDBFactory")}}。</dd> + <dt>{{domxref("IDBEnvironmentSync")}} {{obsolete_inline}}</dt> + <dd>同步版本的 {{domxref("IDBEnvironment")}}。</dd> + <dt>{{domxref("IDBDatabaseSync")}} {{obsolete_inline}}</dt> + <dd>同步版本的 {{domxref("IDBDatabase")}}。</dd> + <dt>{{domxref("IDBCursorSync")}} {{obsolete_inline}}</dt> + <dd>同步版本的 {{domxref("IDBCursor")}}。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<ul> + <li><a href="https://marco-c.github.io/eLibri/">eLibri:</a> 由 IndexedDB Mozilla DevDerby 的获奖者 Marco Castelluccio 编写的一个功能强大的图书馆和电子书阅读器应用。</li> + <li><a href="https://github.com/chrisdavidmills/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a href="https://mdn.github.io/to-do-notifications/">view example live</a>): 参考文档中示例的应用程序。</li> + <li><a href="http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/">Storing images and files in IndexedDB</a></li> +</ul> + +<h2 id="Browser_compatibility" name="Browser_compatibility">规范</h2> + +<table> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName("IndexedDB 2")}}</td> + <td>{{Spec2("IndexedDB 2")}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('IndexedDB')}}</td> + <td>{{Spec2('IndexedDB')}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="https://localforage.github.io/localForage/">localForage</a>:一个简单的 Polyfill,提供了简单的客户端数据存储的值语法。它在后台使用 IndexedDB,并在不支持 IndexedDB 的浏览器中回退到 WebSQL 或 localStorage。</li> + <li><a href="http://www.dexie.org/">Dexie.js</a>:IndexedDB 的包装,通过简单的语法,可以更快地进行代码开发。</li> + <li><a href="https://github.com/erikolson186/zangodb">ZangoDB</a>:类似 MongoDB 的 IndexedDB 接口,支持 MongoDB 的大多数熟悉的过滤、投影、排序、更新和聚合功能。</li> + <li><a href="http://jsstore.net/">JsStore</a>:一个带有 SQL 语法的 IndexedDB 包装器。</li> + <li><a href="https://github.com/mWater/minimongo">MiniMongo</a>:<font>由 localstorage 支持的客户端内存中的 mongodb,通过 http 进行服务器同步。</font><font>MeteorJS 使用 MiniMongo。</font></li> + <li><a href="https://pouchdb.com/">PouchDB</a>:使用 IndexedDB 在浏览器中实现 CouchDB 的客户端。</li> + <li><a href="https://www.npmjs.com/package/idb">idb</a>:一个微小的(〜1.15k)库,大多 API 与 IndexedDB 类似,但做了一些小的改进,让数据库的可用性得到了大大的提升。</li> + <li><a href="https://www.npmjs.com/package/idb-keyval">idb-keyval</a>:使用 IndexedDB 实现的超级简单且小巧的(~600B)基于 Promise 的键值对存储。</li> + <li><a href="https://www.npmjs.com/package/@sifrr/storage">sifrr-storage</a>:一个非常小的(~2kB)基于 Promise 的客户端键值数据库。基于 IndexedDB、localStorage、WebSQL 和 Cookies 实现。它可以自动选择上述支持的数据库,并按照优先顺序使用。</li> + <li><a href="https://github.com/google/lovefield">lovefield</a>:Lovefield 是一个用于 Web App 的关系型数据库,使用 JavaScript 编写,可以在不同的浏览器环境中运行,提供了类似 SQL 的 API,速度快、安全且易用。</li> +</ul> |