Categories: JS & jQuery

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);
  }
 });
}

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

 

 

 

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

Recent Posts

Что такое Customer Development (кастдев)? #понятия_веб_разработки #вебликбез

https://falconspace.ru/blog/bazovye-voprosy-i-ponyatiya-v-sfere-sozdaniya-veb-proektov - Основы веб-разработки. Базовые понятия для владельца сайта

10 часов ago

Что такое Целевая аудитория? #понятия_веб_разработки #вебликбез

https://falconspace.ru/blog/bazovye-voprosy-i-ponyatiya-v-sfere-sozdaniya-veb-proektov - Основы веб-разработки. Базовые понятия для владельца сайта

1 день ago

Что такое Концепция сайта? Что такое Бриф на разработку сайта? #понятия_веб_разработки #вебликбез

https://falconspace.ru/blog/bazovye-voprosy-i-ponyatiya-v-sfere-sozdaniya-veb-proektov - Основы веб-разработки. Базовые понятия для владельца сайта

2 дня ago

Каким должен быть личный кабинет информационной системы?

Вероятно, у вас есть сайт и вы подумываете, что было бы неплохо внедрить в него…

3 дня ago

Что такое Итерация, этап, спринт? #понятия_веб_разработки #вебликбез

https://falconspace.ru/blog/bazovye-voprosy-i-ponyatiya-v-sfere-sozdaniya-veb-proektov - Основы веб-разработки. Базовые понятия для владельца сайта

6 дней ago

Что такое Рейт эстимейт почасовая ставка? #понятия_веб_разработки #вебликбез

https://falconspace.ru/blog/bazovye-voprosy-i-ponyatiya-v-sfere-sozdaniya-veb-proektov - Основы веб-разработки. Базовые понятия для владельца сайта

1 неделя ago