indexDB 数据持久化存储

122 阅读1分钟

创建数据库,写入数据

window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction || window.msIDBTransaction;window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange;const customerData = [  { ssn: "444-44-4444", name: "Bill", age: 35, email: "bill@company.com" },  { ssn: "555-55-5555", name: "Donna", age: 32, email: "donna@home.org" },];const dbName = "the_name";var request = indexedDB.open(dbName, 2);request.onerror = function (event) {  // 错误处理};request.onupgradeneeded = function (event) {  var db = event.target.result;  // 建立一个对象仓库来存储我们客户的相关信息,我们选择 ssn 作为键路径(key path)  // 因为 ssn 可以保证是不重复的  var objectStore = db.createObjectStore("customers", { keyPath: "ssn" });  // 建立一个索引来通过姓名来搜索客户。名字可能会重复,所以我们不能使用 unique 索引  objectStore.createIndex("name", "name", { unique: false });  // 使用邮箱建立索引,我们向确保客户的邮箱不会重复,所以我们使用 unique 索引  objectStore.createIndex("email", "email", { unique: true });  // 使用事务的 oncomplete 事件确保在插入数据前对象仓库已经创建完毕  objectStore.transaction.oncomplete = function (event) {    // 将数据保存到新创建的对象仓库    var customerObjectStore = db.transaction("customers", "readwrite").objectStore("customers");    customerData.forEach(function (customer) {      customerObjectStore.add(customer);    });  };};

获取数据

 window.indexedDB =        window.indexedDB ||        window.mozIndexedDB ||        window.webkitIndexedDB ||        window.msIndexedDB;        window.IDBTransaction =        window.IDBTransaction ||        window.webkitIDBTransaction ||        window.msIDBTransaction;        window.IDBKeyRange =        window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange;        // var dbName =  "the_name";        var request = window.indexedDB.open('the_name');                    request.onerror = function (event) {        // 错误处理!        };        request.onsuccess = function (event) {            var db = event.target.result;            var transaction = db.transaction(["customers"]);            var objectStore = transaction.objectStore("customers");            var request = objectStore.get("444-44-4444");            request.onsuccess = function (evt) {                console.log(request.result)            }        };