今回の記事では、作成したデータベースにデータを入れていきます。
前回のおさらいです。
コードは以下になります。
var dbVersion = 1;
var indexedDB = window.indexedDB || window.webkitindexedDB || window.mozIndexedDB;
var request = indexedDB.open(dbName,dbVersion);
request.onupgradeneeded() = function(event){
var db = event.target.result;var objectStore = db.createObjectStore("objectstorename",{keypath:"key"})
objectStore.createIndex("firstIndex","firstIndexKeyPath");
}
少し話がずれますが、大事なことなので、作成環境について説明します。
Indexed DBの作成は、HTML5とJavaScriptですが、サーバーが必要になります。
何故なら、Indexed DBはSame Origin Policyを使っています。
これはドメインが違ったら、データベースにアクセス出来ないようになっている、ということです。
XSS（クロスサイトスクリプティング）予防のためです。
では、本題のデータを入れていく話に戻りましょう。
request.onupgradeneeded() = function(event){
var db = event.target.result;var objectStore = db.createObjectStore("objectstorename",{keyPath:"key"})
objectStore.createIndex("firstIndex","firstIndexKeyPath");
objectStore.add({firstIndexKeyPath:"firstIndexのバリュー",key:"キーのバリュー"})
}
これは、こういう事です。
{objectstorename:{key:"キーのバリュー",firstIndexKeyPath:"firstIndexのバリュー"}}
この方法は、onupgradeneededの時に、データを入れる方法です。
が、基本的の形は一緒です。objectStore.add()で入れます。
いつもアップグレードする訳ではありません。
なので、普通の場合はこうなります。
request.onsuccess()=function(){
var db = event.target.result;
var transaction = db.transaction("objectstorename", "readwrite");
var objectStore = transaction.objectStore("objectstorename");
objectStore.add({firstIndexKeyPath:"firstIndexのバリュー",key:"キーのバリュー"});
transaction.oncomplete=function(event){
alert("追加完了");
}
transaction.onerror = function(event) {
alert ('追加失敗.');
}
db.close()
}
となります。
この時点で、もうよくわからない？
もがいてください笑
データベースの消し方はindexedDB.deleteDatabase("データベース名");となるので、
var req = indexedDB.deleteDatabase(dbName);
req.onblocked = function(){
alert("Got Blocked on Deleting Database. Please close other tabs and reload.");
};
req.onsuccess = function(){
alert("Deleted Database Successfully");
};
req.onerror=function(){
alert("Error on Deleting Database");
};
となります。
エラーやブロックされる場合は、実力行使ですね。
実際のファイルを消すという方法もあります。
