最近在做一个功能,需要将用户上传的文件暂时存下来,等到后期再上传,但是sessionStorage等里面只能存字符串,file对象存不了,用window接收的话,页面刷新之后文件就没了,所以就想到了indexedDB
- 在浏览器中使用indexedDB数据库的时候,首先需要对indexedDB数据库,该数据库所使用的事务,IDBKeyRange对象与游标对象进行定义
//indexedDB数据库对象
window.indexedDB=window.indexedDB||window.webkitIndexedDB||window.mozIndexedDB||window.msIndexedDB
//事务对象
window.IDBTransaction=window.IDBTransaction||window.webkitIDBTransaction||window.mozIDBTransaction||window.msIDBTransaction
//IDBKeyRange对象
window.IDBKeyRange=window.IDBKeyRange||window.webkitIDBKeyRange||window.mozIDBKeyRange||window.msIDBKeyRange
//游标对象
window.IDBCursor=window.IDBCursor||window.webkitIDBCursor||window.mozIDBCursor||window.msIDBCursor
//数据库名
var dbName='indexedDBTest';
//版本号
var dbVersion=20150420;
//数据库对象的open方法返回一个IDBOpenDBRequest对象,代表一个请求连接数据库的请求对象
var dbConnect=indexedDB.open(dbName,dbVersion);
- 监听IDBOpenDBRequest对象的onsuccess事件和onerror事件来定义事件处理函数
dbConnect.onsuccess=function(e){
//得到连接成功的IDBDatabase数据库对象
idb=e.target.result;
console.log('连接数据库成功');
var tx=idb.transactioon(['Users'],'readonly');
var store=tx.objectStore('Users');
var req=store.count();
req.onsuccess=function(){
console.log('有'+this.result+'条记录');
}
}
dbConnect.onerror = function(e){
alert('数据库连接失败');
};
- 对于创建对象仓库和索引的操作,只能在版本更新事务内部进行(因为indexedDB中不允许数据库中的数据仓库在同一个版本中发生变化)
当指定版本号大于当前版本号时自动触发版本更新事件,在indexedDB数据库中只能针对被设为索引的属性值进行检索,不能针对没有被设为索引的属性值进行检索,在indexedDB数据库中,不能创建同名的对象仓库。
dbConnect.onupgradeneeded=function(e){
//IDBDatabase
idb=e.target.result;
//版本更新事务
var tx=e.target.transaction;
//仓库名
var name='Users2';
//仓库的参数对象 KeyPath相当于主键 autoIncrement(自动增加主键值)
var optionalParameters={
keyPath:'userId',
autoIncrement:false
}
//对象仓库 使用IDBDatabase的createObjectStore方法创建对象仓库
var store=idb.createObjectStore(name,optionalParameters);
alert('对象仓库创建成功');
//索引名
var indexName='userNameAddressIndex';
//索引字段可以为多个,组合索引,检索的时候也要同时写上多个
var keyPath=['userName','Address'];
//索引参数对象
var indexOptionalParameters={
unique:false,
multiEntry:false
}
//索引对象 因为索引的作用在对象仓库上的,所以使用对象仓库的createIndex方法创建索引
//相当于数据库中的创建数据表,然后为该表创建索引
var idx=store.createIndex(indexName,keyPath,indexOptionalParameters);
alert('索引创建成功');
}
- 使用事务,保存数据,为了保存数据,首先要连接某个indexedDB数据库,并且在连接成功后使用该数据库对象的transaction方法开启 一个读写事务。
dbConnect.onsuccess=function(e){
//得到连接成功的IDBDatabase数据库对象
idb=e.target.result;
console.log('数据库连接成功');
//开启事务,规定作用于哪几个对象仓库,模式是什么
var tx=idb.transaction(['Users'],'readwrite');
tx.oncomplete=function(){
//事务完成时触发,事务所在的函数结束,即事务完成
}
tx.onabort=function(){
//事务中止时触发
}
//获得事务作用范围中的某个对象仓库
var store=tx.objectStore('Users');
var value={
userId:1,
userName:'张三',
address:'住址1'
}
//使用对象仓库的put方法插入数据,返回的是IDBRequest对象,代表一个向仓库发出的请求
//类似的add方法,若该主键值在对象仓库中已存在,则保存失败,使用put则会更新对象仓库的该条数据
var req=store.put(value);
req.onsuccess=function(){}
req.onerror=function(){}
}
dbConnect.onsuccess=function(e){
idb=e.target.result;
console.log('数据库连接成功');
//开启事务,规定作用于哪几个对象仓库,模式是什么
var tx=idb.transaction(['Users'],'readwrite');
//与上例代码一样,事务改成只读的readonly
//根据主键值get到数据,返回的是IDBRequest对象
var store=tx.objectStore('Users');
var req = sotre.get(1);
req.onsuccess=function(){
if(this.result==undefined){
//
} else{
//data即为当初保存的js对象
var data=this.result;
}
}
req.onerror=function(){}
}
//可以使用对象仓库的get方法获取,也可以根据索引名获取该对象仓库的索引,然后使用索引对象的get方法从对象仓库中获取数据
//如 var idx=store.index('userNameIndex');
//userNameIndex为索引名
var req=idx.get('张三')
//返回的同样是IDBRequest对象,参数为设为索引的字段
- 使用对象仓库或者索引的get方法,只能获取到一条数据,若想获取一批数据,则要使用游标对象window.IDBKeyRange
funciton findData(){
var tx=idb.transactioon(['Users'],'readonly');
var store=tx.objectStore('Users');
var idx=store.index('userNameIndex');
//通过游标检索主键值在1到4之间的数据
var range=IDBKeyRange.bound('1','4');
//按主键值升值排列
var direction='next';
//通过对象仓库打开一个游标,也可以使用索引打开游标
// var req=idx.openCursor(range,direction),此时range的参数为索引的字段
var req=store.openCursor(range,direction);
req.onsuccess=function(){
var cursor=this.result;
if(cursor){
//this.result.value为一条数据
alert('检索到一条数据用户名为:'+cursor.value.Name);
cursor.continue();
}else{
alert('检索结束');
}
}
req.onerror=function(){alert('检索数据失败');}
}
indexedDB.deleteDatabase(name);