IndexedDB は、ファイルや blob を含む構造化された多くのデータを保存する、クライアントサイドのローレベル API です。この API は高パフォーマンスなデータの検索を行うために、インデックスを使用します。DOM Storage が比較的少量のデータを保存するのに有用であるのに対し、IndexedDB は構造化された非常に多くのデータの保存するのに有用な手段を提供します。IndexedDB が解決策を提供します。本ページは、MDN における IndexedDB のランディングページです。ここでは API リファレンスへのリンク、使用ガイド、ブラウザのサポート状況、主要なコンセプトの説明を掲載します。
注記: IndexedDB API は強力ですが、シンプルな事例でもとても複雑に見えるかもしれません。シンプルな API が好ましいのでしたら、IndexedDB をよりユーザーフレンドリーにする localForage や dexie.js などのライブラリを検討してください。
注記: 古いブラウザで、IndexedDB をサポートせずに WebSQL をサポートしているものがあります。この問題の回避策として未サポートブラウザ向けに、WebSQL または localStorage にフォールバックする、IndexedDB の Polyfill や Shim を使用する方法があります。現在もっとも有用な Polyfill は、localForage です。
主要なコンセプトと使用法
IndexedDB は SQL ベースの RDBMS に似たトランザクショナルデータベースシステムですが、SQL ベース の RDBMS が固定された列を持つテーブルを使用するのに対して、IndexedDB は JavaScript ベースのオブジェクト指向データベースです。IndexedDB では、キーでインデックス付けされたオブジェクトを保存および取り出すことができます。Structured Clone アルゴリズムがサポートする、任意のオブジェクトを保存できます。データベースのスキーマを定義する、データベースへの接続を確立する、そして一連のトランザクションでデータの取り出しや更新を行うことが必要です。
- IndexedDB のコンセプトを詳しく知る
- IndexedDB 使用ガイドで、非同期に IndexedDB を扱い方法を基本原理から学ぶ
- オフラインアプリのページで、オフラインで動作する Web アプリの推奨作成法を知る
注記: たいていの Web ストレージ技術と同様に、IndexedDB も同一生成元ポリシーに従います。よって、保存済みデータは同一ドメイン内からアクセスできますが、異なるドメインにまたがってデータへアクセスすることはできません。
同期と非同期
IndexedDB を扱う操作は非同期に実行しますので、他のアプリケーションを妨げません。IndexedDB は元々非同期 API と同期 API の両方を提供していました。同期 API は Web Workers 内での使用のみを意図していましたが、必要性に疑問があったため仕様から削除されました。ただし、Web 開発者から十分な要望がある場合は、将来再び導入される可能性があります。
ストレージの上限と破棄基準
クライアントサイド (すなわちローカルディスク) に何らかのデータを保存する Web 技術がいくつかあり、IndexedDB はそのような技術としてもっともよく語られます。ブラウザがどれだけの容量を Web データストレージに割り当てるかや、容量の上限に達したときにどのデータを削除するかのプロセスは単純ではなく、またブラウザにより異なります。Browser storage limits and eviction criteria で、少なくとも Firefox ではどのようにしているかを説明しようとしています。
他のブラウザがどのようにしているかは、情報を入手でき次第追加する予定です。
IndexedDB のインターフェイス
データベースへのアクセスを行いたい場合は、window オブジェクトの indexedDB
属性上の open()
を呼び出してください。このメソッドは IDBRequest
オブジェクトを返します。IDBRequest
オブジェクト上で発火したイベントによってアプリケーションが呼び出されることにより、非同期操作が行われます。
データベースへの接続
IDBEnvironment
- IndexedDB 機能へのアクセスを提供します。
window
およびworker
オブジェクトによって実装されています。 IDBFactory
- データベースへのアクセスを提供します。
indexedDB
グローバルオブジェクトによって実装されており、従って API へのエントリーポイントになります。 IDBOpenDBRequest
- データベースを開くリクエストを表します。
IDBDatabase
- データベース接続を表します。データベースとのトランザクション処理を行うためのみに使用されます。
データの取り出しと変更
IDBTransaction
- トランザクションを表します。(アクセスしたいオブジェクトストアの) スコープを指定し、(読み取り専用または読み書き可能といった) アクセスの種類を定義して、データベースへのトランザクションを作成します。
IDBRequest
- データベースへのリクエストの処理、および結果へのアクセスを提供する汎用インターフェイスです。
IDBObjectStore
- IndexedDB 内のデータセットにアクセスできるオブジェクトストアを表し、主キーを使用して探索します。
IDBIndex
- こちらも IndexedDB データベース内のデータのサブセットにアクセスできますが、レコードの探索に主キーではなくインデックスを使用します。
IDBObjectStore
より高速に動作する場合があります。 IDBCursor
- オブジェクトストアとインデックスをイテレートします。
IDBCursorWithValue
- オブジェクトストアとインデックスをイテレートして、カーソルの現在の値を返します。
IDBKeyRange
- データベースから一定の範囲のデータを取り出すために使用可能な、キーの範囲を定義します。
IDBLocaleAwareKeyRange
- データベースから一定の範囲のデータを取り出すために使用可能な、インデックス用に指定したロケール (
createIndex()
の optionalParameters をご覧ください) の規則によって並べ替えたキーの範囲を定義します。
カスタムイベントインターフェイス
本仕様では、以下のカスタムインターフェイスでイベントが発生します:
IDBVersionChangeEvent
IDBVersionChangeEvent
インターフェイスは、IDBOpenDBRequest.onupgradeneeded
イベントハンドラ関数によってデータベースのバージョンが変更されたことを表します。
廃止インターフェイス
仕様の早期段階で定義されていたインターフェイスの一部が、現在、削除されています。以前書いたコードを最新の仕様に合わせて更新する際に必要になるであろうことから、削除されたインターフェイスに関するドキュメントは残してあります:
IDBVersionChangeRequest
- データベースのバージョンの変更リクエストを表現します。データベースのバージョンを変更する方法が (
IDBDatabase.setVersion
ではなくIDBFactory.open
を呼び出すように) 変わりました。また削除されたIDBVersionChangeRequest
に代わりIDBOpenDBRequest
インターフェイスが用意されています。 IDBDatabaseException
- データベース操作が実行されている間に発生した例外状況を表します。
IDBTransactionSync
- 同期型の
IDBTransaction
です。 IDBObjectStoreSync
- 同期型の
IDBObjectStore
です。 IDBIndexSync
- 同期型の
IDBIndex
です。 IDBFactorySync
- 同期型の
IDBFactory
です。 IDBEnvironmentSync
- 同期型の
IDBEnvironment
です。 IDBDatabaseSync
- 同期型の
IDBDatabase
です。 IDBCursorSync
- 同期型の
IDBCursor
です。
例
- eLibri: Marco Castelluccio が作成した、高度なライブラリおよび電子書籍リーダーアプリケーションです。IndexedDB Mozilla DevDerby の最優秀作品です。
- To-do Notifications (ライブデモ): リファレンスドキュメントで例示している、参考アプリケーションです。
- Storing images and files in IndexedDB
仕様
仕様書 | 策定状況 | コメント |
---|---|---|
Indexed Database API | 勧告 | 最初の定義 |
ブラウザ実装状況
機能 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
基本サポート | 23.0 webkit 24 |
10.0 (10.0) moz 16.0 (16.0) |
10 (部分的) | 15 | 7.1 |
Workers で使用可能 | (有) | 37.0 (37.0)[1] | 未サポート[3] | (有) | 未サポート[4] |
IDBLocaleAwareKeyRange |
未サポート | 43.0 (43.0)[2] | 未サポート | 未サポート | 未サポート |
機能 | Android | Firefox Mobile (Gecko) | Firefox OS | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
基本サポート | 4.4 | 22.0 (22.0) | 1.0.1 | 10 | 22 | 8 |
Workers で使用可能 | (有) | 37.0 (37.0)[1] | (有) | ? | (有) | ? |
IDBLocaleAwareKeyRange |
未サポート | 43.0 (43.0)[2] | 2.5[2] | 未サポート | 未サポート | 未サポート |
- [1] Gecko 42 (Firefox 42.0 / Thunderbird 42.0 / SeaMonkey 2.39) より前のバージョンでは、
IDBCursorWithValue
を Workers で使用できません。 - [2] この機能はフラグによって隠されています。有効化して試行するには、about:config で dom.indexedDB.experimental を true に設定してください。
- [3] IE/Edge bug #866495
- [4] WebKit bug #149953
関連情報
- localForage: クライアントサイドのデータストレージ向けに、シンプルな name:value 形式の構文を提供する Polyfill です。バックグラウンドで IndexedDB を使用しますが、IndexedDB をサポートしないブラウザでは WebSQL や localStorage にフォールバックします。
- dexie.js: 優良でシンプルな構文により高速なコード開発を可能にする、IndexedDB のラッパーです。