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
- Android 2.1+
- IOS 3.2+
- Chrome 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) + '"';
};
})()
};
}
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.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 parsearJSON
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.