Almacenamiento local y almacenamiento de sesión

localStorage (almacenamiento local) y sessionStorage (almacenamiento de sesiones) son dos API proporcionadas por HTML5 WebStorage. Las diferencias son las siguientes:

El ciclo de vida de localStorage es permanente. o navegar Los datos en localStorage no desaparecerán después de que se cargue el servidor. Los datos nunca desaparecen a menos que se eliminen activamente.

El ciclo de vida de sessionStorage solo es válido en la sesión actual. sessionStorage introduce el concepto de "ventana del navegador", y sessionStorage son datos que siempre existen en la misma ventana de origen. Mientras la ventana del navegador no esté cerrada, los datos seguirán existiendo incluso si actualiza la página o ingresa a otra página de la misma fuente. Pero sessionStorage se destruirá después de cerrar la ventana del navegador. Al mismo tiempo, la misma ventana y la misma página se abren de forma independiente, y el almacenamiento de sesión también es diferente.

El tamaño de los datos de almacenamiento de localStorage y sessionStorage es generalmente: 5 MB

Tanto localStorage como sessionStorage se almacenan en el cliente y no interactúan con el servidor.

localStorage y sessionStorage solo pueden almacenar tipos de cadenas. Para objetos complejos, puede usar stringify y analizar objetos JSON proporcionados por ECMAScript para manejarlos.

localStorage: window.localStorage; window .sessionStorage

localStoragese: a menudo se usa para inicios de sesión a largo plazo (+ para determinar si el usuario ha iniciado sesión), adecuado para el almacenamiento local a largo plazo de datos. sessionStorage: inicio de sesión único para cuentas confidenciales

La cookie es de 4 KB, mientras que WebStorage es de 5 MB

WebStorage no se transmitirá al servidor y los datos almacenados localmente se pueden almacenar. obtenidas directamente, ni como las cookies, todas las solicitudes de palabras bonitas se enviarán al servidor, reduciendo así la interacción entre el cliente y el servidor y ahorrando tráfico de red

Para aquellas que solo necesitan ser guardadas; Mientras el usuario navega por un conjunto de páginas y cierra el navegador, Para los datos que pueden descartarse más adelante, sessionStorage será muy conveniente;

Algunos datos se almacenan en WebStorage, además del caché del propio navegador. Al obtener datos, se pueden obtener localmente mucho más rápido que desde el servidor, por lo que es más rápido;

WebStorage no se enviará al servidor con el encabezado HTTP, por lo que es más seguro que las cookies. , no hay necesidad de preocuparse por la interceptación, pero aún existe el problema de la falsificación;

setItem (clave, valor): guarda datos y almacena información en forma de pares clave-valor.

getItem (clave): obtiene datos, pasa el valor de la clave y podrá obtener el valor correspondiente.

removeItem (clave): elimina un solo dato, según la clave; El valor elimina la información correspondiente.

clear () - eliminar todos los datos;

clave (índice) - obtener la clave de un índice

Método para guardar datos:

p>

Cómo leer datos:

Cómo guardar datos:

Cómo leer datos:

1. El llamado navegador El intercambio de información de la página solo se puede realizar mediante localStorage, y la premisa es el mismo nombre de dominio, protocolo y número de puerto. Para sessionStorage, incluso si el nombre de dominio, protocolo y puerto son los mismos, la información de sessionStorage no se puede compartir. p>

2. El ciclo de vida de localStorage es permanente, lo que significa que, a menos que el usuario borre manualmente la información de localStorage, la información existirá para siempre. El ciclo de vida de sessionStorage es la ventana o pestaña actual. cerrado, entonces se borrarán todos los datos almacenados a través de sessionStorage.

Al guardar datos, si usa sessionStorage para leer o guardar datos, use el objeto sessionStorage y llame a los métodos de lectura y escritura del objeto; si usa localStorage para leer o guardar datos, use el objeto localStorage; y llame a los métodos de lectura y escritura del objeto. Al leer y escribir, no importa qué objeto sea, puede leer datos a través del método getItem del objeto, o puede leer datos a través del valor del atributo personalizado del objeto, puede guardar datos a través del método setItem del objeto o mediante la propiedad personalizada del objeto; los valores contienen datos. Al guardar datos, guárdelos en forma de "nombre de clave/valor de clave". Al leer datos a través del método getItem del objeto, especifique el parámetro como el nombre de la clave y el método devuelve el valor de la clave; cuando lea datos a través del valor del atributo personalizado del objeto, puede especificar un nombre de atributo personalizado del objeto Como; un nombre de clave, puede obtener el valor de la clave accediendo al valor del atributo personalizado cuando guarde datos a través del método setItem del objeto, especifique el primer parámetro como el nombre de la clave y el segundo parámetro como el valor de la clave cuando; Al guardar datos a través del valor del atributo personalizado del objeto, puede usar un nombre de atributo personalizado del objeto como nombre de clave y luego establecer directamente el valor del atributo personalizado como valor clave. No está permitido guardar el mismo nombre de clave repetidamente al guardar datos. El valor de la clave se puede modificar después de guardar, pero no se permite modificar el nombre de la clave (solo puede cambiar el nombre de la clave y luego guardar el valor de la clave).