Almacenamientos web (localStorage – sessionStorare)

javascript webstorage

javascript webstorage

El almacenamiento web es un mecanismo en javascript que permite a los navegadores o browsers almacenar información en las máquinas de los internautas.. digamos que es como una cookie, pero su funcionamiento es un poco más complejo, más claro y más poderoso.

Utilizar éstos métodos es sumamente sencillo ya que forman parte del objeto window del navegador y su sintaxis de uso es de la siguiente manera:

window.localStorage['test'] = "Jackfiallos";
console.log(window.localStorage['test']);
// output: Jackfiallos
 
window.sessionStorage['test'] = "Qbit Mexhico";
console.log(window.sessionStorage['test']);
// output: Qbit Mexhico

Las diferencias entre localStorage y sessionStorage por implementación no varían como pueden ver en el ejemplo, pero su vida o tiempo de almacenamiento es muy diferente. La propiedad localStorage hace que su valor prevalezca aunque el navegador se haya cerrado y la computadora se haya apagado.. digamos que deja una copia de los datos en la base de datos local del navegador y claro, estos datos se pueden eliminar cuando se borra la caché del navegador.. en cambio la propiedad sessionStorage solamente se mantiene viva mientras el usuario mantenga abierto el navegador o la pestaña donde se ha inicializado la propiedad, es el equivalente a una variable de sesión en el servidor.

Sobre los métodos disponibles en estas propiedades tenemos:

– getItem(clave): obtener el valor de un elemento
– setItem(clave, valor): setear el valor de un elemento
– removeItem(clave): elimina un elemento de la lista
– clear(): elimina todos los elementos de la lista
– key(i): nos brinda el nombre de una clave específica, para usarlo es necesario hacerlo utilizando un ciclo
– length(): número de elementos contenidos en la lista

estos métodos aplican tanto para localStorage como para sessionStorage.

En cuanto a la seguridad, los valores contenidos en estas propiedades solamente pueden ser accedidos a través del mismo origen.. me refiero solamente utilizando la misma url por ej.. http:qbit.com.mx es diferente de https://qbit.com.mx o igualmente diferente que http://qbit.com.mx/blog .. por lo que las verificaciones de seguridad no se realizan a nivel de dominio.

Entonces ahora que las aplicaciones SPA “single page applications” están de moda, utilizar local y session storage, permite una mayor personalización de estas aplicaciones sin tener que utilizar almacenamiento en el servidor, espero que de algo les sirva esta explicación.

Más información o referencia la pueden encontrar en este enlace http://www.w3.org/TR/webstorage/

Happy coding 😀

Co-fundador de Qbit Mexhico, usuario de linux, Developer en tecnologías web.. Nicaragüense, centro en basketball, primer centro en rugby y pintor los fines de semana. Ortögrafo y ambientalista psicológico (de escritorio).. ese soy yo!

Si te ha servido compártelo y difunde nuestro blog..

Facebook Twitter LinkedIn Google+ Flickr YouTube Skype 

Compartir en...Tweet about this on TwitterPin on Pinterest0Share on LinkedIn0Share on Google+0Share on Facebook0