Local storage y Session storage son almacenes del navegador donde el código frontend puede guardar pequeñas piezas de datos sin enviar una solicitud al servidor.
A menudo guardan ajustes de interfaz, borradores de formularios, flags técnicos, estados temporales y a veces datos que no deberían estar allí.
Ambos almacenes guardan datos por clave y valor. La diferencia principal es cuánto viven los datos y dónde están disponibles.
Local storage
Local storage es mejor para estados que deben permanecer después de cerrar una pestaña o el navegador.
Se guarda hasta limpieza manual, limpieza del navegador o eliminación por código de la aplicación.
Disponible para todas las pestañas con el mismo origin: protocolo, dominio y puerto coinciden.
Ajustes de interfaz, esquema de colores, idioma.
Session storage
Session storage es mejor para estados que solo se necesitan dentro de la pestaña actual.
Persiste después de recargar la página.
Disponible solo en la pestaña actual y se limpia al cerrar esa pestaña.
Paso actual de formulario, filtros temporales, pistas de una sola pestaña.
| Comprobación | Local storage | Session storage |
|---|---|---|
| Recarga de página | permanece | permanece |
| Cerrar la pestaña | permanece | se limpia |
| Nueva pestaña del mismo sitio | permanece | se limpia |
| Limpieza mediante DevTools o código | se limpia | se limpia |
Define claves y valores, luego guárdalos. Después abre DevTools y encuentra los mismos pares en el almacenamiento del navegador.
-
-
Abre esta página en una nueva pestaña: Local storage estará disponible, mientras que Session storage se limpiará.
Importante: tokens, contraseñas, datos de pasaporte, datos de pago y otros valores sensibles no deben guardarse en el almacenamiento del navegador.
Уровень повышен!
