HTML5の「Indexed Database API」を習得するためのリンク集

特徴や情報のまとめ。

Indexed Database APIの概要と，他のAPIと比べた場合の特徴について。トランザクションやインデックスが使えるNoSQLである：

HTML5 - Indexed Database API
http://www.tohoho-web.com/html5/index...

• Cookie や Webストレージが Key-Value形式、Web SQLデータベースが SQL をサポートするのに対し、Indexed Database API では、SQLに依存しない NoSQL に分類される方法でデータにアクセスします。

連載：人気順に説明する初めてのHTML5開発：Webアプリもオフライン実行？ Indexed Databaseを使いこなそう (1/2) - ＠IT
http://www.atmarkit.co.jp/ait/article...

• インデックスやトランザクションなどの機能を利用したい場合はIndexedDBを選択することになるだろう。ただし、提供される機能を活用するためにはWeb Storageに比べて手続きが煩雑になるので、シンプルなデータを手軽に保存したい場合はWeb Storageを使用する方がよい。

まだ普及が不十分で，とくにAppleのiOSはIndexed Database APIの導入に積極的でない件について：

Indexed Database API をオフラインのスマホやタブレットで使いたい Web 業界の技術屋 | VIVID Labs.
http://labs.vividworks.jp/indexed_dat...

• 今後メンテナンスが無く、いつ消えても文句は言えない状態の Web SQL Database API なんて使ってらんないぜ！推奨されている Indexed Database API ってのに乗り換えよう！ と色んな解説サイトを巡りながらサンプルを作ってみたのは良かったのですが… iOS で動かないのよ、コレが。

Indexed Database APIでCRUD - KINの雑記帳
http://kinformationtechnology.hatenab...

• Appleは導入に非積極的なようです。

Indexed Database API について - へっぽこプログラマーの日記
http://d.hatena.ne.jp/pikotea/2011012...

• indexDB は、まだまだ実装途中です。バージョンが変われば、そのままのコードでは動かなくなる可能性がかなり高いので、本格的なアプリを作れるようになるには、もう少し時間がかかるでしょう。

サンプルコードで実習：

Indexed Database APIによるデータベース(1/7):JavaScriptによるHTML5プログラミング入門
http://libro.tuyano.com/index3?id=697001

• Web SQL Database API自体は既にWebブラウザで実装されていますので、いきなり使えなくなることはないでしょう。当分の間、それぞれのブラウザに実装された機能はそのまま使い続けることができます。が、最終的にHTML5のデータベース機能は、Indexed Database APIで統一されるのはほぼ間違いない

Indexed Database APIによるデータベース(2/7):JavaScriptによるHTML5プログラミング入門
http://libro.tuyano.com/index3?id=697...

• IDBFactory、IDBDatabase、IDBRequest

Indexed Database APIによるデータベース(3/7):JavaScriptによるHTML5プログラミング入門
http://libro.tuyano.com/index3?id=697...

• データベース利用の際には、まずsetVersionでバージョンの設定を行います。そしてこれが成功したなら、onsuccessプロパティに設定されている関数を呼び出し処理をします。つまり、ここにオブジェクトストア取得のための処理を用意しておけばいい

Indexed Database APIによるデータベース(4/7):JavaScriptによるHTML5プログラミング入門
http://libro.tuyano.com/index3?id=697...

• createObjectStoreでオブジェクトストアを作成した際、{ keyPath: "name" }という引数を指定していたのを思い出してください。これで、"name"という項目がデータの管理に用いられることが指定されました。ということは、保管するデータには必ずnameという項目の値を用意しておく、ということ

Indexed Database APIによるデータベース(5/7):JavaScriptによるHTML5プログラミング入門
http://libro.tuyano.com/index3?id=697...

• getの引数は、検索するキーのテキストを指定します。getは、IDBRequestというオブジェクトを返します。 これで得られるデータは、保管した連想配列の形になっています。が、しかしgetで直接結果が得られるわけではありません。getを実行すると、無事検索が完了した場合には、IDBRequestオブジェクトのの「onsuccess」プロパティに設定された関数が呼び出されます。この関数内で、検索結果の処理をするのです。

Indexed Database APIによるデータベース(6/7):JavaScriptによるHTML5プログラミング入門
http://libro.tuyano.com/index3?id=697...

• Indexed Database APIは、「イベントのプロパティに関数を設定し、その関数内で必要な処理をする」といったコーディングがかなり多いことが分かるでしょう。やや面倒くさい感じはしますが、慣れてしまえばそんなに複雑な処理ではありません。これでごくシンプルなデータベースなどは十分作成できる

Indexed Database APIによるデータベース(7/7):JavaScriptによるHTML5プログラミング入門
http://libro.tuyano.com/index3?id=697...

• 稀にですがChromeでデータの追加や削除など一部の機能がうまく動かなくなることがありました。これはデータベースファイルの破損に原因があるようで、一度オブジェクトストアを破棄し、新たに作りなおすと正常に機能しました