HTML 5のクライアントサイド・データベースストレージ

最新特集【一覧】

EPUB生成ツール「ReVIEW」について達人出版会の高橋氏に聞いてみた

1つのソースでEPUBとPDFを生成できる「ReVIEW」を試す

Snow Leopard探索記 最終回：線路は続くよどこまでも

SQLでより複雑なデータの保存が可能に

　前回まではHTML 5で新しく導入される予定のDOM Storageを使ってローカル側にデータを保存する方法を紹介してきた。HTML 5にはもうひとつ、クライアントサイド・データベースストレージと呼ばれる機能が用意される（長いのでここではローカルDBと記載することにする）。これはローカル側のリレーショナルデータベースに、ウェブアプリケーションで利用するデータを保存し、SQLでアクセスできるというもの。DOM Storageはキーと値のセットという形でしかデータを保持できなかったが、ローカルDBを使えばより複雑な構造を持ったデータを保存することが可能となる。

　残念ながら、Firefox 3ではまだこの機能はサポートされていない。FirefoxではFirefox 2の頃よりローカル側にデータを保存するデータベース機能が用意されていたが、これは拡張機能のためのものであり、ウェブアプリケーションからアクセスすることはできない。とは言えFirefoxはHTML 5に準拠させるという方針で開発されているため、近い将来サポートされることになるだろう。

　さて、HTML 5ではこのローカルDBを扱うオブジェクトとして「Database」というオブジェクトが新しく定義された。データの格納や取り出しは、1.まずこのDatabaseオブジェクトを取得し、2.トランザクションを開始した上で、3.SQLを実行する、という手順で行う。そのために、それぞれ次のようなメソッドが用意されている。

1. openDatabase() - データベースを開いてDatabaseオブジェクトを取得する
2. transaction() - トランザクションを開始する
3. executeSql() - SQLを実行する

　openDatabase()はWindowオブジェクトが持つメソッドである。transaction()はopenDatabase()によって取得したDatabaseオブジェクトに対して使用することでトランザクションを開始し、esecuteSql()によるSQLの実行を可能にする。

　なお、ローカルDBはDOM Storageと同様にsame-origin-policyに則って同じOriginを持つサイト間でのみ共有される。次回からは各メソッドの具体的な使用方法を解説する。