Estoy probando LocalStorage para guardar datos en la memoria del cliente y tengo un problema que no consigo resolver.
Guardo un objeto transformado en cadena por medio de setItem en LocalStorage y puedo acceder a este refrescando el navegador (Chrome 49.0) tranquilamente. El problema viene cuando cierro el navegador los datos no se conservan.
functions.js
'use strict';
var obj = {}; // Creamos un Obj en ambito global
var objsOnArray = []; // Creamos un Array en ambito global
var arrayOnString = ''; // Creamos un String en ambito global
// Recibimos los valores del formulario
function save( uno, dos ) {
// Los valores los agregamos al Obj
obj = {
"uno": uno.value,
"dos": dos.value
};
// El Obj lo añadimos a un array que va a contener los objetos
objsOnArray.push( obj );
console.log( objsOnArray ); // Array[Obj, Obj, ...]
// Transformamos este array de objetos a una cadena de texto para guardarla en local
arrayOnString = JSON.stringify( objsOnArray );
console.log( arrayOnString ); // String
// Lo mandamos al LocalStorage
localStorage.setItem( "all", arrayOnString );
console.log( localStorage ); // String
// Devolvemos el Obj para que se almacene en el ámbito global
return objsOnArray;
}
function getLocal() {
// accedemos a All en LocalStorage y lo reconvertimos en Obj
objsOnArray = JSON.parse( localStorage.getItem("all") );
console.log( objsOnArray ); // Obj
// Devolvemos el Obj para almacenarlo en el ámbito global
return objsOnArray;
}
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<form name="form">
<input name="uno" type="text">
<input name="dos" type="text">
<input type="button" value="Enviar" onclick="save( uno, dos )">
</form>
<script src="functions.js"></script>
<script src="launch.js"></script>
</body>
</html>
launch.js
// Cuando esté cargado ejecuta...
window.onload = function() {
// Si hay datos almacenados al abrír el navegador, muestralos
if( localStorage.length > 0 ) {
console.log('ONLOAD >>> Ya había datos en LocalStorage');
return getLocal();
} else {
return console.log('ONLOAD >>> NO había ningún dato');
}
};
¿Alguien sabe como solucionarlo?