IndexedDB для хранения больших структурированных данных на клиенте

IndexedDB — стандарт хранения больших структурированных данных на клиенте. Это объектная база данных, которая намного мощнее, эффективнее и надежней, чем веб-хранилище пар ключ/значение, доступное посредством прикладного интерфейса Web Storage. Является простой коллекцией именованных хранилищ объектов. Каждый объект должен иметь ключ, под которым он сохраняется и извлекается из хранилища.

Существует также возможность выполнять поиск по значениям других свойств объекта. Чтобы обеспечить эту возможность, в хранилище объектов можно определить любое количество индексов. Каждый индекс определяет вторичный ключ хранимых объектов. Эти индексы в целом могут быть неуникальными, и одному и тому же ключу может соответствовать множество объектов. Поэтому в операциях обращения к хранилищу объектов с использованием индекса обычно используется курсор, определяющий прикладной интерфейс для извлечения объектов из потока результата по одному.

В качестве примера показано хранение файлов:

var indexedDB    = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB,
 IDBTransaction  = window.IDBTransaction || window.webkitIDBTransaction || window.msIDBTransaction,
 baseName    = "filesBase",
 storeName    = "filesStore";

function logerr(err){
 console.log(err);
}

function connectDB(f){
 var request = indexedDB.open(baseName, 1);
 request.onerror = logerr;
 request.onsuccess = function(){
  f(request.result);
 }
 request.onupgradeneeded = function(e){
  e.currentTarget.result.createObjectStore(storeName, { keyPath: "path" });
  connectDB(f);
 }
}

function getFile(file, f){
 connectDB(function(db){
  var request = db.transaction([storeName], "readonly").objectStore(storeName).get(file);
  request.onerror = logerr;
  request.onsuccess = function(){
   f(request.result ? request.result : -1);
  }
 });
}

function getStorage(f){
 connectDB(function(db){
  var rows = [],
   store = db.transaction([storeName], "readonly").objectStore(storeName);

  if(store.mozGetAll)
   store.mozGetAll().onsuccess = function(e){
    f(e.target.result);
   };
  else
   store.openCursor().onsuccess = function(e) {
    var cursor = e.target.result;
    if(cursor){
     rows.push(cursor.value);
     cursor.continue();
    }
    else {
     f(rows);
    }
   };
 });
}

function setFile(file){
 connectDB(function(db){
  var request = db.transaction([storeName], "readwrite").objectStore(storeName).put(file);
  request.onerror = logerr;
  request.onsuccess = function(){
   return request.result;
  }
 });
}

function delFile(file){
 connectDB(function(db){
  var request = db.transaction([storeName], "readwrite").objectStore(storeName).delete(file);
  request.onerror = logerr;
  request.onsuccess = function(){
   console.log("File delete from DB:", file);
  }
 });
}

Ссылка на подробный источник

Руслан Раянов