Библиотека JS localforage, которая прорывается через локальное автономное хранилище

задняя часть база данных внешний интерфейс JavaScript

Введение в местный корм

адрес проектаGitHub.com/local forage…

API китайский адресlocalforage.docschina.org/

Когда дело доходит до локального хранилища, первое, о чем мы думаем, это хранилище localStorage, которое использовалось многими людьми, но у localStorage есть следующие недостатки:

  1. Ограничение емкости хранилища, большинство браузеров должно быть не более 5 МБ.
  2. Поддерживаются только строки, если вы храните объекты, вам нужно использовать методы JSON.stringify и JSON.parse для преобразования
  3. Чтение является синхронным, что хорошо работает в большинстве случаев, но если сохраненные данные относительно велики, например, при сохранении большого изображения в формате base64, повторное чтение может вызвать задержку.

Роль loaclforage заключается в том, чтобы избежать описанных выше недостатков localStorage, сохранив при этом преимущества localStorage.

Преимущество localforage заключается в том, что API очень прост и удобен в использовании, поэтому их использование почти одинаково.

Логика localforage такова: сначала используйте IndexDB для хранения данных, если браузер не поддерживает WebSQL, если он все еще не поддерживает его, используйте localStorage

localforage предоставляет API обратного вызова, а также поддерживает API ES6 Promises, который вы можете выбрать самостоятельно.

Установить

Вы можете использовать npm install localforage или bower install localforage

getItem(key, successCallback)

Получите значение, соответствующее ключу, из репозитория и передайте результат функции обратного вызова. Если ключ не существует, getItem() вернет null.

getItem() также возвращает значение null при сохранении значения undefined. Из-за ограничений localStorage, а также по причинам совместимости localForage не может хранить undefined.

localforage.getItem('somekey').then(function(value) {
    // 当离线仓库中的值被载入时,此处代码运行
    console.log(value);
}).catch(function(err) {
    // 当出错时,此处代码运行
    console.log(err);
});

// 回调版本:
localforage.getItem('somekey', function(err, value) {
    // 当离线仓库中的值被载入时,此处代码运行
    console.log(value);
});

setItem(key, value, successCallback)

Сохранение данных в автономном хранилище. Вы можете хранить объекты JavaScript следующих типов

  • Array
  • ArrayBuffer
  • Blob
  • Float32Array
  • Float64Array
  • Int8Array
  • Int16Array
  • Int32Array
  • Number
  • Object
  • Uint8Array
  • Uint8ClampedArray
  • Uint16Array
  • Uint32Array
  • String

При использовании localStorage и WebSQL в качестве серверной части двоичные данные сериализуются перед сохранением (и извлечением). Сериализация приводит к увеличению размера при сохранении двоичных данных.

localforage.setItem('somekey', 'some value').then(function (value) {
    // 当值被存储后,可执行其他操作
    console.log(value);
}).catch(function(err) {
    // 当出错时,此处代码运行
    console.log(err);
});

// 不同于 localStorage,你可以存储非字符串类型
localforage.setItem('my array', [1, 2, 'three']).then(function(value) {
    // 如下输出 `1`
    console.log(value[0]);
}).catch(function(err) {
    // 当出错时,此处代码运行
    console.log(err);
});

// 你甚至可以存储 AJAX 响应返回的二进制数据
req = new XMLHttpRequest();
req.open('GET', '/photo.jpg', true);
req.responseType = 'arraybuffer';

req.addEventListener('readystatechange', function() {
    if (req.readyState === 4) { // readyState 完成
        localforage.setItem('photo', req.response).then(function(image) {
            // 如下为一个合法的 <img> 标签的 blob URI
            var blob = new Blob([image]);
            var imageURI = window.URL.createObjectURL(blob);
        }).catch(function(err) {
          // 当出错时,此处代码运行
          console.log(err);
        });
    }
});


removeItem(key, successCallback)

Удалите значение, соответствующее ключу, из автономного репозитория.

localforage.removeItem('somekey').then(function() {
    // 当值被移除后,此处代码运行
    console.log('Key is cleared!');
}).catch(function(err) {
    // 当出错时,此处代码运行
    console.log(err);
});

clear(successCallback)

Удалить все ключи из базы, сбросить базу.

localforage.clear() удалит все значения в автономном репозитории. Используйте этот метод с осторожностью.

localforage.clear().then(function() {
    // 当数据库被全部删除后,此处代码运行
    console.log('Database is now empty.');
}).catch(function(err) {
    // 当出错时,此处代码运行
    console.log(err);
});

length(successCallback)

Получите количество ключей в автономном хранилище (т.е. «длину» хранилища данных).

localforage.length().then(function(numberOfKeys) {
    // 输出数据库的大小
    console.log(numberOfKeys);
}).catch(function(err) {
    // 当出错时,此处代码运行
    console.log(err);
});

key(keyIndex, successCallback)

Получить имя ключа на основе его индекса

localforage.key(2).then(function(keyName) {
    // key 名
    console.log(keyName);
}).catch(function(err) {
    // 当出错时,此处代码运行
    console.log(err);
});

keys(successCallback)

Получить все ключи в хранилище данных

localforage.keys().then(function(keys) {
    // 包含所有 key 名的数组
    console.log(keys);
}).catch(function(err) {
    // 当出错时,此处代码运行
    console.log(err);
});

setDriver(driverName)
setDriver([driverName, nextDriverName])

Принудительно применить определенные настройки драйвера, если они доступны

По умолчанию localForage выбирает серверный драйвер для хранилища данных в следующем порядке:

  1. IndexedDB
  2. WebSQL
  3. localStorage

Если вы хотите принудительно использовать определенный драйвер, вы можете использоватьsetDriver(), параметры являются одним или несколькими из следующих:

  • localforage.INDEXEDDB
  • localforage.WEBSQL
  • localforage.LOCALSTORAGE

Если серверный драйвер, который вы пытаетесь загрузить, недоступен в браузере, localForage будет использовать один из ранее использовавшихся внутренних драйверов. Это означает, что если вы попытаетесь заставить браузер Gecko использовать WebSQL, он потерпит неудачу и продолжит использовать IndexedDB.

// 强制设置 localStorage 为后端的驱动
localforage.setDriver(localforage.LOCALSTORAGE);

// 列出可选的驱动,以优先级排序
localforage.setDriver([localforage.WEBSQL, localforage.INDEXEDDB]);

config(options)

Установите параметр localForage. При вызове localForage

вперед
Он должен быть вызван первым, но может быть вызван после загрузки localForage. Любые значения конфигурации, установленные с помощью этого метода, будут сохраняться даже после изменения драйвера, поэтому вы также можете вызватьconfig()позвони сноваsetDriver(). Можно установить следующие значения конфигурации:

driver

Имя базы данных. Может появиться в подсказке в базе данных. Как правило, используйте имя вашего приложения. В localStorage он добавляет префикс ко всем ключам, хранящимся в localStorage.

По умолчанию: 'localforage'

name

Имя базы данных. Может появиться в подсказке в базе данных. Как правило, используйте имя вашего приложения. В localStorage он добавляет префикс ко всем ключам, хранящимся в localStorage.

По умолчанию:'localforage'

size

Размер базы данных в байтах. Теперь только для WebSQL

Значение по умолчанию: 4980736

storeName

Имя хранилища данных. DataStore в IndexedDB или имя таблицы ключ/значение базы данных в WebSQL. Содержит только буквы, цифры и символы подчеркивания. Любые не буквенно-цифровые символы будут преобразованы в символы подчеркивания.

По умолчанию:'keyvaluepairs'

version

Версия базы данных. Доступно для будущих обновлений; в настоящее время не используется.

Значение по умолчанию: 1,0

description

Описание базы данных обычно предоставляется разработчику.

По умолчанию: ''

// 将数据库从 “localforage” 重命名为 “Hipster PDA App”
localforage.config({
    name: 'Hipster PDA App'
});

// 将强制使用 localStorage 作为存储驱动,即使其他驱动可用。
// 可用配置代替 `setDriver()`。
localforage.config({
    driver: localforage.LOCALSTORAGE,
    name: 'I-heart-localStorage'
});

// 配置不同的驱动优先级
localforage.config({
    driver: [localforage.WEBSQL,
             localforage.INDEXEDDB,
             localforage.LOCALSTORAGE],
    name: 'WebSQL-Rox'
});

Справочный адресу-у-у-у. palms.com/WordPress/2…