Se puede de diferentes maneras:
localStorage
cookies
sessionStorage
Definiciones
localStorage
El almacenamiento web puede verse de manera simplista como una mejora
de las cookies, lo que proporciona una capacidad de almacenamiento
mucho mayor. El tamaño disponible es de 5 MB, que es mucho más espacio
para trabajar que una cookie típica de 4 KB. Los datos no se envían de
nuevo al servidor para cada solicitud HTTP (HTML, imágenes,
JavaScript, CSS, etc.), lo que reduce la cantidad de tráfico entre el
cliente y el servidor.
Los datos almacenados en localStorage persisten hasta que se eliminan
explícitamente. Los cambios realizados se guardan y están disponibles
para todas las visitas actuales y futuras del sitio.
Funciona en la política del mismo origen. Por lo tanto, los datos
almacenados solo estarán disponibles en el mismo origen.
Ejemplo
// seteo y almaceno en la variable miGato el valor Juan
window.localStorage.setItem('miGato', 'Juan');
// obtengo el valor de miGato
var gato = window.localStorage.getItem('miGato');
// lo muestro en el log
console.log(gato);
// elimino la variable miGato
window.localStorage.removeItem('miGato');
// elimino toda la data almacenada
window.localStorage.clear();
cookies
Podemos establecer el tiempo de caducidad de cada cookie.
El límite de 4K es para toda la cookie, incluido el nombre, el valor,
la fecha de caducidad, etc. Para admitir la mayoría de los
navegadores, mantenga el nombre bajo 4000 bytes y el tamaño total de
la cookie bajo 4093 bytes.
Los datos se envían al servidor para cada solicitud HTTP (HTML,
imágenes, JavaScript, CSS, etc.), lo que aumenta la cantidad de
tráfico entre el cliente y el servidor.
sessionStorage
Es similar al almacenamiento local.
Los cambios solo están disponibles por ventana (o pestaña en
navegadores como Chrome y Firefox). Los cambios realizados se guardan
y están disponibles para la página actual, así como para futuras
visitas al sitio en la misma ventana. Una vez cerrada la ventana, se
borra el almacenamiento.
Los datos solo están disponibles dentro de la ventana / pestaña en la
que se configuró. Los datos no son persistentes, es decir, se perderán
una vez que se cierre la ventana / pestaña. Como localStorage,
funciona en la política del mismo origen. Por lo tanto, los datos
almacenados solo estarán disponibles en el mismo origen.
Ejemplo
// seteo y almaceno en la variable miGato el valor Juan
window.sessionStorage.setItem('miGato', 'Juan');
// obtengo el valor de miGato desde sessionStorage
var gato = window.sessionStorage.getItem('miGato');
// lo muestro en el log
console.log(gato);
// elimino la variable miGato
window.sessionStorage.removeItem('miGato');
// elimino toda la data almacenada
window.sessionStorage.clear();