共计 4030 个字符,预计需要花费 11 分钟才能阅读完成。
前段时间项目需要本地存储聊天数据,使用到 indexedDB,经查阅大量文章,终于完成。感觉网上 indexedDB 的文章不够多,也不够完善,因此把代码分享出来,帮助需要的小伙伴。由于时间原因,不做详细介绍,后续再补充说明。
打开数据库
IndexedDB.openDB(myDB.name,myDB.version,function (e) {// 成功回调});
添加数据:
IndexedDB.addData(myDB.db,"talkList",[{id:serverMsgId,name:nickName,target:muid.toLocaleLowerCase(),time:time,type:2,msg:tempmsg}]);
查询数据:
IndexedDB.getDataByMultiple(myDB.db,"talkList","target",id.toLocaleLowerCase(),function (e) {// 成功回调});
indexedDB.js:
var myDB = {
name: 'GRTalk',
version: 1,
db: null,
ojstore: [
{
name: 'name',// 存储空间表的名字
keypath: 'id'// 主键
}
]
};
var IndexedDB = {
indexedDB: window.indexedDB || window.webkitindexedDB,
IDBKeyRange: window.IDBKeyRange || window.webkitIDBKeyRange,// 键范围
openDB: function (dbname, dbversion, callback) {// 建立或打开数据库,建立对象存储空间 (ObjectStore)
var self = this;
var version = dbversion || 1;
var request = self.indexedDB.open(dbname, version);
request.onerror = function (e) {console.log(e.currentTarget.error.message);
};
request.onsuccess = function (e) {
myDB.db = e.target.result;
console.log('成功建立并打开数据库:' + myDB.name + 'version' + dbversion);
callback && callback(e);
};
request.onupgradeneeded = function (e) {
var db = e.target.result;
if (!db.objectStoreNames.contains('talkList')) {var objectStore = db.createObjectStore('talkList', {keyPath: 'id'});
objectStore.createIndex('target', 'target', {unique: false});
}
}
},
deletedb: function (dbname) {
// 删除数据库
var self = this;
self.indexedDB.deleteDatabase(dbname);
console.log(dbname + '数据库已删除')
},
closeDB: function (db) {
// 关闭数据库
db.close();
console.log('数据库已关闭')
},
addData: function (db, storename, data) {
// 添加数据,重复添加会报错
try{var store = db.transaction(storename, 'readwrite').objectStore(storename), request;
}catch (e) {alert(e)
}
for (var i = 0; i < data.length; i++) {request = store.add(data[i]);
request.onerror = function () {//alert('add 添加数据库失败')
};
request.onsuccess = function () {//alert('add 添加数据已存入数据库')
};
}
},
putData: function (db, storename, data) {
// 添加数据,重复添加会更新原有数据
var store = store = db.transaction([storename], 'readwrite').objectStore(storename), request;
for (var i = 0; i < data.length; i++) {request = store.put(data[i]);
request.onerror = function () {console.error('put 添加数据库中已有该数据')
};
request.onsuccess = function () {console.log('put 添加数据已存入数据库')
};
}
},
getDataByStore: function (db, storename, cb) {var store = db.transaction([storename], 'readwrite').objectStore(storename);
var allRecords = store.getAll();
allRecords.onsuccess = function () {cb && cb(allRecords.result);
};
},
getDataByKey: function (db, storename, key, cb) {
// 根据存储空间的键找到对应数据
var store = db.transaction([storename], 'readwrite').objectStore(storename);
var request = store.get(key);
request.onerror = function () {console.error('getDataByKey error');
};
request.onsuccess = function (e) {
var result = e.target.result;
console.log('查找数据成功');
cb && cb(result);
};
},
getDataByTarget: function (db, storename, target, cb) {
try {var store = db.transaction([storename], 'readonly').objectStore(storename);
var index = store.index('target');
var request = index.get(target);
request.onerror = function () {console.error('getDataByTarget error');
};
request.onsuccess = function (e) {
var result = e.target.result;
console.log('查找数据成功');
cb && cb(result);
};
} catch (e) {console.log("数据不存在");
}
},
getDataByFetch: function (db, storeName) {var transaction = db.transaction(storeName);
var store = transaction.objectStore(storeName);
var request = store.openCursor();
request.onsuccess = function (e) {
var cursor = e.target.result;
if (cursor) {console.log(cursor.key);
var currentStudent = cursor.value;
console.log(currentStudent.name);
cursor.continue();}
};
},
getDataByMultiple: function (db, storeName, key, id, cb) {var transaction = db.transaction(storeName);
var store = transaction.objectStore(storeName);
var keyRange = IDBKeyRange.only(id);
var req = store.index(key).openCursor(keyRange, "next");
req.onsuccess = function (e) {var arr = [];
var cursor = e.target.result;
if (cursor) {
var res = cursor.value;
console.log(res);
arr.push(res);
cb && cb(arr);
cursor.continue();}
}
},
deleteData: function (db, storename, key) {
// 删除某一条记录
var store = store = db.transaction(storename, 'readwrite').objectStore(storename);
store.delete(key);
console.log('已删除存储空间' + storename + '中' + key + '记录');
},
clearData: function (db, storename) {
// 删除存储空间全部记录
var store = db.transaction(storename, 'readwrite').objectStore(storename);
store.clear();
console.log('已删除存储空间' + storename + '全部记录');
}
}
正文完
发表至: javascript
2020-06-29