Резервные решения для хранилища HTML5

Ответ 1

Я использую PersistJS (репозиторий github), который легко и прозрачно защищает клиентское хранилище от вашего кода. Вы используете один API и получаете поддержку для следующих бэкэндов:

• flash: постоянное хранилище Flash 8.
• gears: постоянное хранилище на основе Google Gears.
• localstorage: хранилище черновиков HTML5.
• whatwg_db: хранилище базы данных HTML5.
• globalstorage: хранилище HTML5 (старая спецификация).
• то есть: поведение пользовательских данных в Internet Explorer.
• cookie: постоянное хранилище на основе файлов cookie.

Любой из них может быть отключен — если, например, вы не хотите использовать файлы cookie. С помощью этой библиотеки вы получите поддержку на стороне клиента на стороне клиента в IE 5.5+, Firefox 2.0+, Safari 3.1+ и Chrome; и поддержка плагинов, если браузер имеет Flash или Gears. Если вы включите куки файлы, он будет работать во всем (но будет ограничен 4 КБ).

Ответ 2

Чистая простая локальная хранилища на основе JS polyfill:

Демо: http://jsfiddle.net/aamir/S4X35/

HTML:

<a href='#' onclick="store.set('foo','bar')">set key: foo, with value: bar</a><br/>
<a href='#' onclick="alert(store.get('foo'))">get key: foo</a><br/>
<a href='#' onclick="store.del('foo')">delete key: foo</a>​

JS:

window.store = {
    localStoreSupport: function() {
        try {
            return 'localStorage' in window && window['localStorage'] !== null;
        } catch (e) {
            return false;
        }
    },
    set: function(name,value,days) {
        if (days) {
            var date = new Date();
            date.setTime(date.getTime()+(days*24*60*60*1000));
            var expires = "; expires="+date.toGMTString();
        }
        else {
            var expires = "";
        }
        if( this.localStoreSupport() ) {
            localStorage.setItem(name, value);
        }
        else {
            document.cookie = name+"="+value+expires+"; path=/";
        }
    },
    get: function(name) {
        if( this.localStoreSupport() ) {
            var ret = localStorage.getItem(name);
            //console.log(typeof ret);
            switch (ret) {
              case 'true': 
                  return true;
              case 'false':
                  return false;
              default:
                  return ret;
            }
        }
        else {
            var nameEQ = name + "=";
            var ca = document.cookie.split(';');
            for(var i=0;i < ca.length;i++) {
                var c = ca[i];
                while (c.charAt(0)==' ') c = c.substring(1,c.length);
                if (c.indexOf(nameEQ) == 0) {
                    ret = c.substring(nameEQ.length,c.length);
                    switch (ret) {
                      case 'true': 
                          return true;
                      case 'false':
                          return false;
                      default:
                          return ret;
                    }
                }
            }
            return null;
        }
    },
    del: function(name) {
        if( this.localStoreSupport() ) {
            localStorage.removeItem(name);
        }
        else {
            this.set(name,"",-1);
        }
    }
}​

Ответ 3

Вы видели страницу polyfill на вики-странице Modernizr?

https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills

найдите раздел webstorage на этой странице, и вы увидите 10 потенциальных решений (по состоянию на июль 2011 года).

Удачи! Марк

Ответ 4

Я лично предпочитаю amplify.js. В прошлом он работал очень хорошо, и я рекомендовал его для всех локальных задач хранения.

поддерживает IE 5+, Firefox 2+, Safari 4+, Chrome, Opera 10.5+, iPhone 2+, Android 2+ и предоставляет совместимый API для обработки кросс-браузера хранения

Ответ 5

Ниже приведена унаследованная версия ответа Aamir Afridi, которая хранит весь ее код, инкапсулированный в пределах локальной области.

Я удалил ссылки, которые создают глобальную переменную ret, а также удалил разбор сохраненных строк "true" и "false" в логические значения в методе BrowserStorage.get(), что может вызвать проблемы, если вы пытаетесь на самом деле сохраните строки "true" или "false".

Поскольку локальный API хранения поддерживает только строковые значения, все еще можно сохранить/получить переменные данные JavaScript вместе с их соответствующими типами данных путем кодирования указанных данных в строку JSON, которая затем может быть декодирована с использованием библиотеки кодирования/декодирования JSON, такой как как https://github.com/douglascrockford/JSON-js

var BrowserStorage = (function() {
    /**
     * Whether the current browser supports local storage as a way of storing data
     * @var {Boolean}
     */
    var _hasLocalStorageSupport = (function() {
        try {
            return 'localStorage' in window && window['localStorage'] !== null;
        } catch (e) {
            return false;
        }
    })();

    /**
     * @param {String} name The name of the property to read from this document cookies
     * @return {?String} The specified cookie property value (or null if it has not been set)
     */
    var _readCookie = function(name) {
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for (var i = 0; i < ca.length; i++) {
            var c = ca[i];
            while (c.charAt(0) == ' ') c = c.substring(1, c.length);
            if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
        }

        return null;
    };

    /**
     * @param {String} name The name of the property to set by writing to a cookie
     * @param {String} value The value to use when setting the specified property
     * @param {int} [days] The number of days until the storage of this item expires
     */
    var _writeCookie = function(name, value, days) {
        var expiration = (function() {
            if (days) {
                var date = new Date();
                date.setTime(date.getTime() + (days*24*60*60*1000));
                return "; expires=" + date.toGMTString();
            }
            else {
                return "";
            }
        })();

        document.cookie = name + "=" + value + expiration + "; path=/";
    };

    return {
        /**
         * @param {String} name The name of the property to set
         * @param {String} value The value to use when setting the specified property
         * @param {int} [days] The number of days until the storage of this item expires (if storage of the provided item must fallback to using cookies)
         */
        set: function(name, value, days) {
            _hasLocalStorageSupport
                ? localStorage.setItem(name, value)
                : _writeCookie(name, value, days);
        },

        /**
         * @param {String} name The name of the value to retrieve
         * @return {?String} The value of the 
         */
        get: function(name) {
            return _hasLocalStorageSupport
                ? localStorage.getItem(name) 
                : _readCookie(name);
        },

        /**
         * @param {String} name The name of the value to delete/remove from storage
         */
        remove: function(name) {
            _hasLocalStorageSupport
                ? localStorage.removeItem(name)
                : this.set(name, "", -1);
        }
    };
})();

Ответ 6

store.js использует userData и IE и localStorage в других браузерах.

• Он не пытается сделать что-то слишком сложное

• Нет файлов cookie, без вспышки, не требуется jQuery.

• Очистить API.

• 5 кб сжатых

https://github.com/marcuswestin/store.js

Ответ 7

Страница MDN для хранилища DOM дает несколько обходных путей, которые используют файлы cookie.

Ответ 8

Lawnchair кажется хорошей альтернативой

лужайка сортируется как кушетка, кроме меньшего размера и снаружи. идеально для мобильных приложений html5, которые нуждаются в легком, адаптивном, простом и элегантное решение для сохранения.

• коллекции. экземпляр lawnchair - это всего лишь массив объектов.
• адаптивная настойчивость. основной магазин абстрагируется за согласованным интерфейсом.
• совместимое поведение коллекции. иногда нам нужны помощники коллекции, но не всегда.

Ответ 9

Существует realstorage, который использует Gears в качестве резервной копии.