0

Estoy desarrollando una app para iOS y Android usando Cordova. Todo me funciona bien, menos una parte que funciona en Android pero no en iOS: el almacenamiento persistente de datos.

En mi código tengo esto:

storage = {
    save: function(name, value) {
        window.localStorage.setItem(name, JSON.stringify(value));
    },
    load: function(name) {
        var aux = window.localStorage.getItem(name);
        if (aux && aux != "") { return JSON.parse(aux); } else { return false; }
    }
}

Luego en mi app, para guardar algún dato hago storage.save("nombre", json_con_datos) y para recuperarlo después simplemente hago storage.load("nombre"). Esto funciona bien en Android donde puedo guardar y recuperar datos sin problemas, pero falla en iOS, donde parece que no se guarda nada.

Estoy haciendo pruebas en iOS 9.3 (tanto dispositivo como emulador) y Android 4.1 (en dispositivo) y 5.0 (en emulador).

Y ahora las preguntas: ¿Qué es lo que falla? ¿Soporta iOS el uso de localStorage? ¿Debería almacenar los datos de otra manera diferente? (¿Y cómo sería?) ¿Existe algún método que funcione tanto en Android como iOS?

4
  • localStorage se encuentra ampliamante soportado en todas las plataformas (Android 2.1+ y IOS 3.2+). Creo que esta nota puede estar relacionada "En iOS 5 & 6 los datos de localStorage son almacenados en un lugar que puede ser limpiado ocasionalmente por el OS". Edita la pregunta e incluye la información del dispositivo donde está ocurriendo el problema.
    – devconcept
    Commented el 9 ago. 2016 a las 14:15
  • @devconcept Actualicé la pregunta con los dispositivos y sus versiones. ¿Puede ser que tenga algo deshabilitiado en mi dispositivo?¿o que como la estoy ejecutando en modo de prueba no se almacenen los datos?
    – Alvaro Montoro
    Commented el 9 ago. 2016 a las 14:37
  • 1
    Conozco de un problema con localStorage cuando se ejecuta en modo incógnito en Safari ya que el tamaño del almacenamiento se pone en 0 y el almacenamiento falla. Por lo demás el API no requiere ningún tipo de permisos específicos y el API de parsear JSON también está ampliamante soportado. Creo que poner el dispositivo en modo a prueba puede limitar el acceso al almacenamiento, también la nueva versión de Android cambia la forma en la que se ponen los permisos por aplicación por lo que podría dejar a la aplicación sin acceso al filesystem. No creo que el soporte sea la causa.
    – devconcept
    Commented el 9 ago. 2016 a las 14:48
  • Échale un vistazo a gist.github.com/paulirish/5558557 y verifica los resultados en tu dispositivo.
    – devconcept
    Commented el 9 ago. 2016 a las 14:52

1 respuesta 1

0

El soporte de sessionStorage y localStorage es bastante amplio por lo que no debe causar problemas en la mayoría de los navegadores/dispositivos en los que los uses. La otra parte de la que depende tu código es en el API de parsear JSON que también tiene amplio soporte. Aquí está el detalles de las versiones que puedes encontrar en caniuse para Storage y JSON

Storage y JSON

  1. Android 2.1+
  2. IOS 3.2+
  3. Chrome 4+
  4. Firefox 3.5+

Existe una alternativa cuando se quiere aumentar el soporte para dichos APIs que es crear un polyfill en memoria pero ten en cuenta que esto no es un reemplazo 100% equivalente ya que

Los datos almacenados en localStorage no tienen fecha de expiración

y

La información almacenada en sessionStorage es eliminada al finalizar la sesion de la página. La sesión de la página perdura mientras el navegador se encuentra abierto, y se mantiene por sobre las recargas y reaperturas de la página

Crear un almacenamiento en memoria te permitirá usar el API pero en cuanto actualizes la página toda esa información se borrará. Puedes usar cookies para sortear este obstáculo pero recuerda que las cookies tienen consideraciones de seguridad y el tamaño de almacenamiento es mucho menor (~5Mb total localStorage => ~ 4 kb por cookie, 20 cookies por dominio).

Aquí está el pollyfill para localStorage. Esta es una variante del oficial de MDN para soportar eventos y el método clear (además de no usar métodos obsoletos como escape y unescape).

if (!window.localStorage) {
    Object.defineProperty(window, 'localStorage', new (function () {
        var aKeys = [], oStorage = {};

        var dispatchStorageEvent = function (key, newValue) {
            var oldValue = (key == null) ? null : oStorage.getItem(key);
            var url = location.href.substr(location.origin.length);
            var storageEvent = document.createEvent('StorageEvent');

            storageEvent.initStorageEvent('storage', false, false, key, oldValue, newValue, url, null);
            window.dispatchEvent(storageEvent);
        };

        Object.defineProperty(oStorage, 'getItem', {
            value: function (sKey) {
                return sKey ? this[sKey] : null;
            },
            writable: false,
            configurable: false,
            enumerable: false
        });
        Object.defineProperty(oStorage, 'key', {
            value: function (nKeyId) {
                return aKeys[nKeyId];
            },
            writable: false,
            configurable: false,
            enumerable: false
        });
        Object.defineProperty(oStorage, 'setItem', {
            value: function (sKey, sValue) {
                if (!sKey) {
                    return;
                }
                document.cookie = encodeURIComponent(sKey) + "=" + encodeURIComponent(sValue) + '; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/';
                dispatchStorageEvent(sKey, sValue);
            },
            writable: false,
            configurable: false,
            enumerable: false
        });
        Object.defineProperty(oStorage, 'length', {
            get: function () {
                return aKeys.length;
            },
            configurable: false,
            enumerable: false
        });
        Object.defineProperty(oStorage, 'removeItem', {
            value: function (sKey) {
                if (!sKey) {
                    return;
                }
                document.cookie = encodeURIComponent(sKey) + '=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/';
                dispatchStorageEvent(sKey, null);
            },
            writable: false,
            configurable: false,
            enumerable: false
        });
        Object.defineProperty(oStorage, 'clear', {
            value: function () {
                document.cookie.split(/\s*;\s*/).forEach(function (c) {
                    document.cookie = c.replace(/^ +/, '').replace(/=.*/, '=;expires=' + new Date().toUTCString() + ';path=/');
                });
                dispatchStorageEvent(null, null);
            },
            writable: false,
            configurable: false,
            enumerable: false
        });

        this.get = function () {
            var iThisIndx;
            for (var sKey in oStorage) {
                iThisIndx = aKeys.indexOf(sKey);
                if (iThisIndx === -1) {
                    oStorage.setItem(sKey, oStorage[sKey]);
                }
                else {
                    aKeys.splice(iThisIndx, 1);
                }
                delete oStorage[sKey];
            }
            for (aKeys; aKeys.length > 0; aKeys.splice(0, 1)) {
                oStorage.removeItem(aKeys[0]);
            }
            for (var aCouple, iKey, nIdx = 0, aCouples = document.cookie.split(/\s*;\s*/); nIdx < aCouples.length; nIdx++) {
                aCouple = aCouples[nIdx].split(/\s*=\s*/);
                if (aCouple.length > 1) {
                    oStorage[iKey = decodeURIComponent(aCouple[0])] = decodeURIComponent(aCouple[1]);
                    aKeys.push(iKey);
                }
            }
            return oStorage;
        };
        this.configurable = false;
        this.enumerable = true;
    })());
}

Nota: Usar el método clear eliminará todas las cookies del documento incluyendo las que no hayan sido creadas con setItem

Aquí hay un polyfill para JSON

if (!window.JSON) {
  window.JSON = {
    parse: function(sJSON) { return eval('(' + sJSON + ')'); },
    stringify: (function () {
      var toString = Object.prototype.toString;
      var isArray = Array.isArray || function (a) { return toString.call(a) === '[object Array]'; };
      var escMap = {'"': '\\"', '\\': '\\\\', '\b': '\\b', '\f': '\\f', '\n': '\\n', '\r': '\\r', '\t': '\\t'};
      var escFunc = function (m) { return escMap[m] || '\\u' + (m.charCodeAt(0) + 0x10000).toString(16).substr(1); };
      var escRE = /[\\"\u0000-\u001F\u2028\u2029]/g;
      return function stringify(value) {
        if (value == null) {
          return 'null';
        } else if (typeof value === 'number') {
          return isFinite(value) ? value.toString() : 'null';
        } else if (typeof value === 'boolean') {
          return value.toString();
        } else if (typeof value === 'object') {
          if (typeof value.toJSON === 'function') {
            return stringify(value.toJSON());
          } else if (isArray(value)) {
            var res = '[';
            for (var i = 0; i < value.length; i++)
              res += (i ? ', ' : '') + stringify(value[i]);
            return res + ']';
          } else if (toString.call(value) === '[object Object]') {
            var tmp = [];
            for (var k in value) {
              if (value.hasOwnProperty(k))
                tmp.push(stringify(k) + ': ' + stringify(value[k]));
            }
            return '{' + tmp.join(', ') + '}';
          }
        }
        return '"' + value.toString().replace(escRE, escFunc) + '"';
      };
    })()
  };
}
2
  • Gracias por la respuesta. La voy a probar en unas horas
    – Alvaro Montoro
    Commented el 11 ago. 2016 a las 19:22
  • Sinceramente, no sé que acabé cambiando, pero ahora funciona en el dispositivo y en el emulador sin problemas. Gracias por la descripción de LocalStorage y su soporte en los diferentes dispositivos
    – Alvaro Montoro
    Commented el 15 ago. 2016 a las 18:32

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.