Window.sessionStorage, window.localStorage y resumen de cookies

Prefacio: El almacenamiento local y las cookies se han utilizado en proyectos recientes. Aunque a menudo se mencionan en la vida diaria, todavía son un poco vagos cuando se usan. Aquí hay un resumen para profundizar la memoria.

Web Storage está diseñado para "almacenar" datos localmente y no se enviará al servidor. Incluye dos métodos de almacenamiento: sessionStorage y localStorage. Estos dos objetos existen en forma de atributos de objeto de ventana en los navegadores compatibles.

Puntos similares:

1. Solo se guarda en el cliente y no participa en la comunicación con el servidor.

2. Ambos tienen el mismo origen. restricciones de políticas y navegación diferente El servidor no puede *compartir la información en localStorage o sessionStorage

3. El tamaño de almacenamiento es de aproximadamente 5 M

Diferencias:

1. Vida ciclo

localStoage: es un almacenamiento permanente a menos que se borre manualmente.

sessionStorage: almacenamiento de sesión. Los datos almacenados en sessionStorage se borrarán cuando finalice la sesión de la página. Es decir, una vez cerrada la ventana o pestaña, todos los datos almacenados a través de sessionStorage también se eliminarán. La sesión de la página se mantiene mientras el navegador está abierto, y recargar o restaurar la página mantendrá la sesión de la página original.

2. Alcance

localStorage: En el mismo navegador, entre documentos homólogos (páginas que pertenecen al mismo nombre de dominio y puerto), incluso se pueden compartir páginas diferentes, se pueden leer datos de localStorage y sobrescritos entre sí.

sessionStorage: Al igual que localStorage, requiere el mismo navegador y el mismo documento fuente. No solo eso, el alcance de sessionStorage también se limita a la ventana, es decir, solo los documentos del mismo origen en el mismo navegador y la misma ventana pueden compartir datos.

Sintaxis:

Tanto el método de almacenamiento sessionStorage como el localStorage tienen casi los mismos métodos y propiedades.

1.localStorage.length y sessionStorage.length: devuelven la longitud de la lista de almacenamiento local; cabe señalar que los datos de almacenamiento correspondientes se pueden obtener a través del objeto localStorage. el nombre de la clave se ha almacenado, use localStorage .name para obtener los datos almacenados; los siguientes métodos se basan en el objeto localStorage o el objeto sessionStorage

método 2.getItem(keyName): obtenga los datos almacenados a través de; la clave;

3. Método setItem (keyName, value): almacena datos, keyName es la clave para almacenar los datos y el valor son los datos reales que se almacenarán (keyName puede entenderse como el nombre dado). a los datos que se almacenarán para facilitar la administración);

4 .método .removeItem(keyName): elimina los datos del nombre de clave especificado

5.método clear(); Borrar todos los datos almacenados;

Método 6.key(): Obtener el valor clave. Cabe señalar que el valor booleano especificado no se puede devolver y necesita procesamiento adicional

Conceptos básicos

p>

1. La cookie es realmente muy pequeña y su tamaño está limitado a aproximadamente 4 KB.

2. Para representar un valor de cookie único, necesita: nombre, dominio, ruta

3. Generalmente generado por el servidor, se puede establecer el tiempo de vencimiento. Si se genera una cookie en el navegador, caducará después de cerrar el navegador de forma predeterminada.

4. Se llevará en el encabezado HTTP cada vez. Si utiliza cookies para guardar demasiados datos, causará problemas de rendimiento.

Uso de cookies

document.cookie, a través de este método se pueden leer, modificar y eliminar las cookies.