HTML5 Web Database まとめ
最近WebDatabaseを使ってWebアプリを作る機会があったので、その時に学習したことをまとめます。
開発するならSafariがおすすめ
現在、Google ChromeとSafariがWebDatabaseに対応していますが、Safariで開発した方が楽な気がします。なぜならば、Safariには「Webインスペクタ」という機能があるからです。
この機能はFirefoxでいうならばFirebugみたいなものなのですが、WebDatabaseやLocalStorage・SessionStorageの中身を見ることができ、さらに中身を書き換えることや実際にSQLを実行することもできます。
データベース作成&読み込み
データベースを作成または読み込むには「openDatabase」関数を使います。
// openDatabase(データベース名, "1.0", ディスプレイ名, サイズ [, コールバック関数]); var db = openDatabase("sample", "1.0", "Sample database", 1024 * 1024);
「ディスプレイ名」は直接処理には関係ありませんがWebインスペクタなどで見たときに表示されるデータベースの名前を指定します。「サイズ」はバイトで指定します。最大サイズはブラウザに依存します。上記を実行するとインスペクタに「sample」データベースが表示されます。
openDatabaseの返り値はDatabaseオブジェクトで、SQLを実行したりするのに使います。
トランザクション実行
テーブルの作成や検索などでSQLを実行するにはトランザクションを実行します。
// db.transaction(トランザクション関数, トランザクション成功時コールバック関数, トランザクションエラー時コールバック関数); db.transaction( function (t) { t.executeSql(〜); }, function () { // success }, function (error) { // error } );