【Javascript】IndexedDBでデータの挿入・取得

JavascriptのIndexedDBでデータの挿入・取得する方法をまとめました。

## IndexedDBでデータの挿入・取得

JavascriptのIndexedDBでデータの挿入・取得してみました。

## サンプルコード

サンプルプログラムのソースコードです。

// データの挿入
function putData(data, dbName, storeName){
  // 挿入するデータ
  var data = {id : 'A1', name : 'test'};

  // データベースに接続
  var openReqest = indexedDB.open(dbName);

  // DB接続成功時の処理
  openReqest.onsuccess = function(event){
    var db = event.target.result;
    var transact = db.transaction(storeName, 'readwrite');
    var store = transact.objectStore(storeName);
    var putRequest = store.put(data);

    // データの挿入成功時の処理
    putRequest.onsuccess = function(){
      console.log('データの挿入に成功しました');
    };

    transact.oncomplete = function(){
      console.log('トランザクション完了');
    };
  };

};
 //
function getData(key, dbName, storeName){
  var openRequest = indexedDB.open(dbName);

  openRequest.onsuccess = function(event){
    var db = event.target.result;
    var trans = db.transaction(storeName, 'readonly');
    var store = trans.objectStore(storeName);
    var getRequest = store.get(key);

    getRequest.onsuccess = function(event){
      return event.target.result;
    };
  };
};

function main(){
  // データ挿入
  var data = {id : 'key1', name : 'test1'};
  putData(data, 'testDB', 'testStore');

  // データの取得
  var data2 =  getData('key1', 'testDB', 'testStore');
};

「オブジェクトストアの作成・削除」はDBの更新時のみ行えます。
そのため、バージョンを指定して更新します。