Soluciones de reserva de almacenamiento local HTML5 [cerrado]

Puro basado en JS simple localStorage polyfill:

Demo: 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 {
            // cookie fallback
            /*
             * after adding a cookie like
             * >> document.cookie = "bar=test; expires=Thu, 14 Jun 2018 13:05:38 GMT; path=/"
             * the value of document.cookie may look like
             * >> "foo=value; bar=test"
             */
            var nameEQ = name + "=";  // what we are looking for
            var ca = document.cookie.split(';');  // split into separate cookies
            for(var i=0;i < ca.length;i++) {
                var c = ca[i];  // the current cookie
                while (c.charAt(0)==' ') c = c.substring(1,c.length);  // remove leading spaces
                if (c.indexOf(nameEQ) == 0) {  // if it is the searched cookie
                    var ret = c.substring(nameEQ.length,c.length);
                    // making "true" and "false" a boolean again.
                    switch (ret) {
                      case 'true':
                          return true;
                      case 'false':
                          return false;
                      default:
                          return ret;
                    }
                }
            }
            return null; // no cookie found
        }
    },
    del: function(name) {
        if( this.localStoreSupport() ) {
            localStorage.removeItem(name);
        }
        else {
            this.set(name,"",-1);
        }
    }
}​

¿Has visto la página polyfill en el wiki de Modernizr?

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

Busque la sección webstorage en esa página y verá 10 soluciones potenciales (a partir de julio de 2011).

¡Buena suerte! Mark

Personalmente prefiero amplificar.js . Ha funcionado muy bien para mí en el pasado y lo recomendé para todas las necesidades de almacenamiento local.

Es compatible con IE 5+, Firefox 2+, Safari 4+, Chrome, Opera 10.5+, iPhone 2+, Android 2 + y proporciona una API consistente para manejar el almacenamiento entre navegadores

A continuación se muestra una versión ordenada de la respuesta de Aamir Afridi que mantiene todo su código encapsulado dentro del ámbito local.

He eliminado las referencias que crean una variable ret global y también eliminé el análisis de las cadenas "true" y "false" almacenadas en valores booleanos dentro del método BrowserStorage.get(), lo que podría causar problemas si uno está tratando de almacenar las cadenas "true" o "false".

Dado que la API de almacenamiento local solo admite valores de cadena, todavía se puede almacenar / recuperar Datos variables de JavaScript junto con sus tipos de datos apropiados codificando dichos datos en una cadena JSON, que luego se puede decodificar utilizando una biblioteca de codificación/decodificación JSON como 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's cookies
     * @return {?String} The specified cookie property's 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);
        }
    };
})();

Conservar.js utiliza userData e IE y localStorage en otros navegadores.

• No intente hacer nada demasiado complejo

• No se necesitan cookies, flash ni jQuery.

• API limpia.

• 5 kb compressed

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

La página MDN para el almacenamiento DOM ofrece varias soluciones alternativas que utilizan cookies.

Silla de césped parece ser una buena alternativa también

Una silla de césped es algo así como un sofá, excepto más pequeño y exterior. perfecto para aplicaciones móviles html5 que necesitan un peso ligero, adaptable, simple y solución de persistencia elegante.

• colecciones. una instancia de lawnchair es realmente solo una serie de objetos.
• persistencia adaptativa. el almacén subyacente se abstrae detrás de una interfaz consistente.
• comportamiento de colección conectable. a veces necesitamos ayudantes de recolección, pero no siempre.

Existe realstorage, que usa Engranajes como alternativa.