En la sesión, cookie, sessionStorage, localStorage, la diferencia y los escenarios
de aplicación del almacenamiento en caché del navegador pueden proporcionar una forma de almacenar datos del usuario en el cliente, puede intercambiar datos utilizando la cookie, sesión, etc. con el servidor.
Uno, cookie y sesión
Tanto la cookie como la sesión son métodos de sesión que se utilizan para rastrear la identidad del usuario del navegador.
la diferencia:
1. Mantener el estado: la cookie se guarda en el lado del navegador y la sesión se guarda en el lado del servidor.
2. Cómo utilizar:
(1) Mecanismo de cookies: si el tiempo de caducidad no está configurado en el navegador, la cookie se almacena en la memoria y el ciclo de vida finaliza cuando se cierra el navegador. Este tipo de cookie se conoce como cookie de sesión. Si el tiempo de caducidad de la cookie está configurado en el navegador, la cookie se guarda en el disco duro. Una vez que se cierra el navegador, los datos de la cookie seguirán existiendo y no desaparecerán hasta que finalice el tiempo de caducidad.
Cookie是服务器发给客户端的特殊信息，cookie是以文本的方式保存在客户端，每次请求时都带上它
(2) Mecanismo de sesión: cuando el servidor recibe una solicitud y necesita crear un objeto de sesión, primero verifica si la solicitud del cliente contiene sessionid. Si hay un id de sesión, el servidor devolverá el objeto de sesión correspondiente de acuerdo con el id. Si no hay un ID de sesión en la solicitud del cliente, el servidor creará un nuevo objeto de sesión y devolverá el ID de sesión al cliente en esta respuesta. El sessionid generalmente se almacena en el cliente en el modo de cookie, y el navegador envía el sessionid al servidor de acuerdo con las reglas durante la interacción. Si el usuario deshabilita las cookies, se puede usar la reescritura de URL, lo que se puede lograr a través de response.encodeURL (url); la API termina con encodeURL ya que, cuando el navegador admite cookies, la URL no realiza ningún procesamiento; cuando el navegador no admitir cookies En ese momento, la URL se reescribirá y el SessionID se empalmará con la dirección de acceso.
3. Contenido de almacenamiento: la cookie solo puede guardar el tipo de cadena, en forma de texto; la sesión se guarda mediante una estructura de datos similar a Hashtable y puede admitir cualquier tipo de objeto (la sesión puede contener varios objetos)
4. Tamaño de almacenamiento: cookie: los datos guardados por una sola cookie no pueden exceder los 4kb, no hay límite para el tamaño de la sesión.
5. Seguridad: cookie: Ataques contra cookies: suplantación de cookies, interceptación de cookies, la seguridad de la sesión es mayor que la de las cookies.
Las razones son las siguientes: (1) La ID de sesión se almacena en la cookie. Si desea interrumpir la sesión, primero debe romper la cookie;
(2) El sessionID solo está disponible cuando alguien inicia sesión o inicia session_start, por lo que es posible que el sessionID no se obtenga rompiendo la cookie;
(3) Después de que se inicia session_start por segunda vez, la ID de sesión anterior no es válida y, una vez que expira la sesión, la ID de sesión también deja de ser válida.
(4) La ID de sesión está encriptada
(5) En resumen, el atacante debe romper el ID de sesión cifrado en poco tiempo, lo cual es difícil.
6. Escenarios de aplicación:
Cookie: (1) Determine si el usuario ha iniciado sesión en el sitio web, para que pueda iniciar sesión automáticamente (o recordar la contraseña) cuando inicie sesión la próxima vez. Si eliminamos la cookie, debemos completar la información relevante sobre el inicio de sesión cada vez que iniciamos sesión.
(2) Guarde información como la hora del último inicio de sesión.
(3) Guarde la última página vista
(4) Recuento de exploraciones
Sesión: la sesión se utiliza para guardar la información dedicada de cada usuario, el valor de la variable se guarda en el lado del servidor y los diferentes clientes se distinguen por SessionID.
(1) Carrito de compras en el centro comercial en línea
(2) Guardar la información de inicio de sesión del usuario
(3) Ponga algunos datos en la sesión para usarlos en diferentes páginas del mismo usuario
(4) Evitar que los usuarios inicien sesión ilegalmente
7. Desventajas: cookie: (1) Tamaño limitado
(2) El usuario puede manipular (deshabilitar) las cookies para restringir la función
(3) Baja seguridad
(4) Algunos estados no se pueden guardar en el cliente.
(5) Las cookies deben enviarse al servidor para cada visita, lo que desperdicia ancho de banda.
(6) Los datos de la cookie tienen el concepto de ruta, que puede restringir la cookie para que solo pertenezca a una ruta determinada.
Sesión: (1) Cuantas más cosas guarde una sesión, más memoria ocupará en el servidor. Para un sitio web con una gran cantidad de usuarios en línea, la presión de memoria en el servidor será mayor.
(2) Confíe en la cookie (la ID de sesión se almacena en la cookie), si la cookie está deshabilitada, se usa la reescritura de URL, lo cual no es seguro
(3) Existe mucha arbitrariedad en la creación de variables de sesión, que se pueden llamar en cualquier momento sin el procesamiento preciso del desarrollador, por lo que el uso excesivo de variables de sesión hará que el código sea ilegible y difícil de mantener.
二 、 WebStorage
El propósito de WebStorage es superar algunas de las limitaciones que traen las cookies.Cuando los datos deben ser controlados estrictamente por el lado del cliente, no hay necesidad de enviar datos continuamente al servidor.
WebStorage tiene dos objetivos principales: (1) Proporcionar una forma de almacenar datos de sesión fuera de las cookies. (2) Proporcionar un mecanismo para almacenar grandes cantidades de datos que pueden existir entre sesiones.
HTML5 WebStorage proporciona dos API: localStorage (almacenamiento local) y sessionStorage (almacenamiento de sesiones).
1. Ciclo de vida: localStorage: El ciclo de vida de localStorage es permanente y los datos en localStorage no desaparecerán después de cerrar la página o el navegador. A menos que localStorage elimine activamente los datos, los datos nunca desaparecerán.
El ciclo de vida de sessionStorage es válido solo en la sesión actual. sessionStorage introduce el concepto de una "ventana del navegador", sessionStorage son datos que siempre existen en ventanas del mismo origen. Mientras la ventana del navegador no esté cerrada, incluso si actualiza la página o ingresa a otra página de la misma fuente, los datos seguirán existiendo. Pero sessionStorage se destruirá después de cerrar la ventana del navegador. Al mismo tiempo, cuando la misma ventana y la misma página se abren de forma independiente, sessionStorage también es diferente.
2. Tamaño de almacenamiento: el tamaño de los datos de almacenamiento de localStorage y sessionStorage es generalmente de 5 MB
3. Ubicación de almacenamiento: tanto localStorage como sessionStorage se almacenan en el cliente y no interactúan con el servidor.
4. Tipo de contenido de almacenamiento: localStorage y sessionStorage solo pueden almacenar tipos de cadena. Para objetos complejos, puede usar la cadena y el análisis del objeto JSON proporcionado por ECMAScript para procesar
5 、 获取 方式 ： localStorage ： window.localStorage ;； sessionStorage ： window.sessionStorage ;。
6. Escenario de aplicación: localStoragese: se utiliza a menudo para el inicio de sesión a largo plazo (+ para determinar si el usuario ha iniciado sesión), adecuado para el almacenamiento a largo plazo de datos locales. sessionStorage: inicio de sesión único para cuentas confidenciales;
Ventajas de WebStorage:
(1) Mayor espacio de almacenamiento: la cookie es de 4 KB, mientras que WebStorage es de 5 MB;
(2) Guardar tráfico de red: WebStorage no se transmitirá al servidor, y los datos almacenados localmente se pueden obtener directamente, y la solicitud de hermosas palabras como cookies no se transmitirá al servidor, por lo que la interacción entre el cliente y el el servidor se reduce y la red se guarda.
(3) Para el tipo de datos que solo necesitan ser guardados mientras el usuario está navegando por un grupo de páginas y pueden ser descartados después de cerrar el navegador, sessionStorage será muy conveniente;
(4) Visualización rápida: algunos datos se almacenan en WebStorage, más el caché del propio navegador. Cuando se obtienen datos, se pueden obtener localmente más rápido que desde el lado del servidor, por lo que la velocidad es más rápida;
(5) Seguridad: WebStorage no se enviará al servidor con el encabezado HTTP, por lo que la seguridad es mayor que la de las cookies, y no hay que preocuparse por la interceptación, pero aún existen problemas de falsificación;
(6) WebStorage proporciona algunos métodos, la manipulación de datos es más conveniente que las cookies;
setItem (clave, valor): guardar datos, almacenar información en forma de pares clave-valor.
getItem (key) —— 获取数据，将键值传入，即可获取到对应的value值。
removeItem (key) —— 删除单个数据，根据键值移除对应的信息。
clear () —— 删除所有的数据
key (index) —— 获取某个索引的key
Dirección de reimpresión: https://www.cnblogs.com/cencenyue/p/7604651.html
Método de uso específico: esta ruta contiene una introducción detallada a los dos métodos de uso de sessionStorage localStorage
https://developer.mozilla.org/zh- CN / docs / Web / API / Window / sessionStorage