html 5 indexeddbの簡明api

6811 ワード

javascript

ネット上でapi、demoを探して、ほとんど満足のいく答えを見つけていないで、まとめて自分の理解を結びつけて、簡単なapiをパッケージしました

// indexedDB       ，              

//       ，open      ，          ，    ，           。
var request = indexedDB.open('myDbName');
request.onsuccess = function(e) {
    //  db  
    var db = e.target.result;
    
    
    //       ：             
    var store = db.createObjectStore('myTableName', {keyPath: 'mykey'});
    
    
    //        （         ），     ：             
    //                   createObjectStore      
    var transaction = db.transaction("myTableName", 'readwrite').objectStore("myTableName");
    //  ，               
    
    
    //             ，            ，      ，      
    
    // ：       add(anything)
    //       add，   put  
    var result = store.add({name:'mykey',value:'test1'});
    
    // ：       delete(keyPath)
    var result = store.delete('mykey');
    
    // ：      ，     put     
    var result = store.put({name:'mykey',value:'test value'});
    
    // ：      
    var result = store.get('mykey');
    
    
    result.onsuccess = function(e) {
        //   get，         
        var obj = e.target.result;
        success(obj);
    };
    result.onerror = function(e) {
    };
}
request.onerror = function() {
};

以下は自分でカプセル化する方法です.

var myDb = {
    options:{
        dbName:'myDbName',
        tbName:'myTableName',
        keyPath:'name',
    },
    getIndexedDB: function(name) {
        var that = this;
        return new Promise(function(success, error) {
            //      
            var request = indexedDB.open(that.options.dbName);
            request.onsuccess = function(e) {
                var database = e.target.result;
                //      
                var store = database.transaction(that.options.tbName, 'readwrite').objectStore(that.options.tbName);
                var result = store.get(name);
                result.onsuccess = function(e) {
                    var obj = e.target.result;
                    success(obj);
                };
                result.onerror = function(e) {
                    error(obj);
                };
            }
            request.onerror = function() {
                error(event);
            };
            //        ，         ，      
            request.onupgradeneeded = function(e) {
                e.target.result.createObjectStore(that.options.tbName, { keyPath: that.options.keyPath });
            };
        });
    },
    getIndexedDBAll: function() {
        var that = this;
        return new Promise(function(success, error) {
            //      
            var request = indexedDB.open(that.options.dbName);
            request.onsuccess = function(e) {
                var database = e.target.result;
                //      
                var store = database.transaction(that.options.tbName, 'readwrite').objectStore(that.options.tbName);
                var cursorRequest = store.openCursor();
                var list = [];
                cursorRequest.onsuccess = function(event) {
                    var cursor = event.target.result;
                    if (cursor) {
                        var value = cursor.value;
                        list.push(value);
                        cursor.continue();
                    } else {
                        success(list);
                    }
                }
            }
            request.onerror = function() {
                error(event);
            };
            //        ，         ，      
            request.onupgradeneeded = function(e) {
                e.target.result.createObjectStore(that.options.tbName, { keyPath: that.options.keyPath });
            };
        });
    },
    saveOneIndexedDB: function(keyValue) {
        var that = this;
        return new Promise(function(success, error) {
            //      
            var request = indexedDB.open(that.options.dbName);
            request.onsuccess = function(e) {
                var database = e.target.result;
                var store = null;
                store = database.transaction(that.options.tbName, 'readwrite').objectStore(that.options.tbName);
                var result = store.put(keyValue);
                result.onsuccess = function(event) {
                    success(keyValue);
                };
                result.onerror = function(event) {
                    error(event);
                };
            }
            request.onerror = function(event) {
                error(event)
            };
            //        ，         ，      
            request.onupgradeneeded = function(e) {
                var store = e.target.result.createObjectStore(that.options.tbName, { keyPath: that.options.keyPath });
                var result = store.put(keyValue);
                result.onsuccess = function(event) {
                    success(keyValue);
                };
                result.onerror = function(event) {
                    error(event);
                };
            };
        });
    },
    saveListIndexedDB: function(list, back, error) {
        var that = this;
        return Promise.all(list.map(function(v) {
            return that.saveOneIndexedDB(v);
        }));
    },
    deleteDB: function(name) {
        var that = this;
        return new Promise(function(success, error) {
            //      
            var request = indexedDB.open(that.options.dbName);
            request.onsuccess = function(e) {
                var database = e.target.result;
                var store = database.transaction(that.options.tbName, 'readwrite').objectStore(that.options.tbName);
                var result = store.delete(name);
                result.onsuccess = function(event) {
                    success(name)
                };
                result.onerror = function(event) {
                    error(event)
                };
            }
            request.onerror = function(event) {
                error(event)
            }
            //        ，         ，      
            request.onupgradeneeded = function(e) {
                e.target.result.createObjectStore(that.options.tbName, { keyPath: that.options.keyPath });
            };
        });
    }
};

テスト:

//          
myDb.options.dbName = 'file_list';
myDb.options.tbName = 'files';

//      ：
myDb.saveOneIndexedDB({
    name:'test',
    file:'123123',
}).then(function(file){
    /**file:{
        name:'test',
        file:'123123',
    }*/
});

//    
myDb.getIndexedDB('ex_zh.js').then(function(v){console.log(v)});

【コンピュータグラフィックス】OpenGL入門1——最初のOpenGLプログラム

ラベル使用例コード