封装ZsfyIndexedDB
var ZsfyIndexedDB = function(){};
ZsfyIndexedDB.indexedDB_name = "db_yuxingxing";
ZsfyIndexedDB.indexedDB_version = 2.0;
ZsfyIndexedDB.db_yuxingxing;//zsfy前端数据库,供各个模块前端缓存使用
ZsfyIndexedDB.doConnection = function(onSuccessCallback){
window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
if (window.indexedDB) {
//打开数据库,没有则创建
var openRequest = window.indexedDB.open(ZsfyIndexedDB.indexedDB_name, ZsfyIndexedDB.indexedDB_version);
//DB数据库新建或者版本变更时回调,可以看成系统全新或升级脚本执行的入口
openRequest.onupgradeneeded = function(e) {
var db = e.target.result;
if(!db.objectStoreNames.contains('LayyList')){
console.log("创建【网上**】缓存");
db.createObjectStore('LayyList',{autoIncrement: false});
}
console.log("创建前端缓存结束");
}
//DB成功打开时回调,由于打开IndexedDB是异步的,要确保数据库打开了再做其他操作
openRequest.onsuccess = function(e) {
console.log("访问前端数据库db_yuxingxing成功!");
ZsfyIndexedDB.db_yuxingxing = e.target.result;
if(onSuccessCallback){
onSuccessCallback();
}
}
//打开数据库失败时调用
openRequest.onerror = function(e){
console.log("访问前端数据库db_yuxingxing失败!");
}
}
};
封装业务模块的操作LayyIndexedDB
//*************** 读写网上**缓存(前台各种保存、暂存、提交) *****************
/**
* 新增或更新一条记录
* @param {} layyInfo object实体
* @param {} layyId 缓存里对应的数据主键
*/
function saveOrUpdateLayyObject(layyInfo,layyId){
var transaction = ZsfyIndexedDB.db_yuxingxing.transaction("LayyList",'readwrite');
var layystore = transaction.objectStore("LayyList");
layystore.put(layyInfo,layyId);
}
/**
* 移除一条记录
* 客户端的缓存直到数据提交,提交后的立案信息,以外网数据库为准,就不再缓存了
* @param {} layyId
*/
function deleteLayyObject(layyId){
var transaction = ZsfyIndexedDB.db_yuxingxing.transaction("LayyList",'readwrite');
var layystore = transaction.objectStore("LayyList");
layystore.delete(layyId);
}
/**
* 异步查询一条记录
* 目前各大浏览器还不支持同步,兼容性也不太好
* @param {} layyId 立案预约ID
* @param {} getCallback 获取结果后的回调函数,不可为空!
*/
function getLayyObjectAsync(layyId,getCallback){
var transaction = ZsfyIndexedDB.db_yuxingxing.transaction("LayyList",'readwrite');
var layystore = transaction.objectStore("LayyList");
layystore.get(layyId).onsuccess = getCallback;
}
客户端调用示例
ZsfyIndexedDB.doConnection(function(){
getLayyObjectAsync(layyId,function(e){
var layyInfo = e.target.result;
var dsrObjArray = layyInfo.dsrList;
});
});
总结
(1)indexDB对数据存储有大小的限制。通常每个域名的最大存数上限是250MB;
(2)数据是永久保存,除非手动删除或者手动清理浏览器数据;
(3)indexDB的操作是基于异步处理的。使用时注意顺序控制;