Close
注：このページの解説は、途中までとなっています。
Indexed Database APIは、JavaScriptでデータベースを可能にするための仕様です。
Indexed Databaseでは、データをキー（key）と値（value）のセットにして、JavaScriptのオブジェクトとして保存します。
データは、ユーザーのローカル環境（ブラウザ）に保存されます。
Indexed Databaseは、key-value型のストレージをデータベースとして利用できるように発展させた仕様と言えるでしょう。
データベースの構造を表すスキーマを定義する必要はありません。
SQLを使用することはできませんが、keyの指定のみでデータを取り出すことができます。
一方で、データの検索をしやすくするためのインデックス作成や、
複数の処理を一連で実行するトランザクション処理などが可能となっています。
リレーショナル・データベースではありませんが、それに近い使い方もできるなど、
データベースとしての基本的な機能は備わっています。
Indexed Databaseによる基本的な処理の流れは、以下の通りです。
Indexed Databaseでは、まずデータベースを作成して、
その中にオブジェクトストアと呼ばれる個々のデータの保存先を作成します。
1つのデータベースの中には、複数のオブジェクトストアを作成することができます。
また、オブジェクトストアの中には、個々のデータをJavaScriptのオブジェクトとしてkey-value型で保存することができます。
Indexed Databaseを利用する際には、まず最初に、indexedDBオブジェクトに対してopen()メソッドを使用してデータベースをオープンします。
var indexedDB = window.indexedDB;
var request = indexedDB.open("データベース名", "データベースの説明");
request.onsuccess = function(evt) {
//データベースのオープンに成功した場合の処理
}
request.onerror = function(evt) {
//データベースのオープンに失敗した場合の処理
}データベースをオープンしたら、onsuccessやonerrorなどのイベントに応じて処理を行います。
| イベントハンドラ名 | イベント発生のタイミング |
|---|---|
| onsuccess | 成功した場合 |
| onerror | 失敗した場合 |
Indexed Database APIは、まだ仕様が完全には確定しておらず、
現時点では、実装されているブラウザで利用する場合でも、
そのブラウザに合わせたベンダープレフィックスを付けてやる必要があるようです。
以下のサンプルは、Indexed Databaseでデータベースがオープンできるかどうかを確かめるだけのごく簡単なものです。
Google Chrome向けとFirefox向けのベンダープレフィックスを付けた書式も含めています。
※メモ：以下のサンプルは、Google Chromeでは動くようですが、Firefoxでは動かないようです。
作成のしかたが悪いのかもしれません。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset=utf-8>
<script>
window.onload = function() {
//結果表示する要素を取得
var msg = document.getElementById("msg");
//Google Chrome向けとFirefox向けのベンダープレフィックスを付けた書式も含める
var indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.moz_indexedDB;
//データベースのオープン
var request = indexedDB.open("sample", "サンプルデータベース");
//データベースのオープンに成功した場合
request.onsuccess = function(evt) {
msg.innerHTML = "データベースをオープンしました。";
}
//データベースのオープンに失敗した場合
request.onerror = function(evt) {
msg.innerHTML = "データベースをオープンできません。";
}
}
</script>
<title>Indexed Databaseサンプル1</title>
</head>
<body>
<h4>Indexed Databaseでデータベースをオープンできるかどうかを確認</h4>
<div id="msg"></div>
</body>
</html>
Indexed Databaseの解説は、とりあえずここまでです。
もう少し仕様が確定してブラウザの動作が安定してきたら続きを解説するかも…です。
| <前へ | 記事一覧へ | 次へ> |
どのカジノが自分に最適か分からないですか?