Diferencia entre almacenamiento local, almacenamiento de sesión y cookies

El protocolo HTTP es uno de los protocolos más importantes para una comunicación fluida entre el servidor y el cliente. La principal desventaja del protocolo HTTP es un protocolo sin estado, lo que significa que no rastrea ningún tipo de información de respuesta y solicitud por parte del servidor y el cliente. Entonces, para resolver este problema, hay tres formas de rastrear información útil en En este artículo vamos a ver la diferencia entre almacenamiento local, almacenamiento de sesión y cookies y por qué es importante que un desarrollador web conozca estos términos. 

Almacenamiento local: esta propiedad de interfaz de solo lectura brinda acceso al objeto de almacenamiento local del documento, los datos almacenados se almacenan en las sesiones del navegador. Similar a sessionStorage, excepto que los datos de localStorage se borran cuando finaliza la sesión de la página, es decir, cuando se cierra la página. Se borra cuando se cierra la última pestaña «privada» de un navegador (datos de almacenamiento local para un documento cargado en una navegación privada o sesión de incógnito).

DOMStrings son formatos de almacenamiento que usan UTF-16 para codificar datos, que usa dos bytes por carácter. Las strings se generan automáticamente a partir de claves enteras tal como lo son para los objetos. Los datos almacenados en LocalStorage son específicos de un protocolo en el documento. Si el sitio se carga a través de HTTP (p. ej., http://example.com), localStorage devuelve un objeto diferente que si se carga a través de HTTPS (p. ej., https://abc.com).

Si un documento se carga desde un archivo: URL (es decir, directamente desde el sistema de archivos local del usuario en lugar de cargarlo desde el servidor), los requisitos de comportamiento no están definidos y pueden variar entre diferentes navegadores. Parece que localStorage devuelve cada archivo como un objeto diferente en todos los navegadores actuales: URL. Esencialmente, parece ser un caso de cada URL: archivo que tiene su propia área de almacenamiento local única.

Este comportamiento no se puede garantizar porque, como se mencionó anteriormente, los requisitos del archivo: URL siguen sin estar claros. Como tal, existe la posibilidad de que los navegadores cambien la forma en que manejan los archivos en cualquier momento. La forma en que algunos navegadores lo manejan ha evolucionado.

El almacenamiento local tiene 4 métodos:

  • Método setItem(): este método toma dos parámetros, uno es clave y otro es valor. Se utiliza para almacenar el valor en una ubicación particular con el nombre de la clave.
    localStorage.setItem(key, value)
  • Método getItem(): este método toma un parámetro que es clave y se usa para obtener el valor almacenado con un nombre de clave particular.
    localStorage.getItem(key)
  • Método removeItem(): este método se utiliza para eliminar el valor almacenado en la memoria en referencia a la clave.
    localStorage.removeItem(key)
  • Método clear(): este método se utiliza para borrar todos los valores almacenados en el almacenamiento local.
    localStorage.clear()

imagen del panel de almacenamiento local

¿Qué es el almacenamiento de sesiones?

Se puede acceder a los objetos de almacenamiento de sesión mediante la propiedad de solo lectura sessionStorage. La diferencia entre sessionStorage y localStorage es que los datos de localStorage no caducan, mientras que los datos de sessionStorage se borran cuando finaliza la sesión de la página.

Se crea una sesión de página única una vez que se carga un documento en una pestaña del navegador. Las sesiones de página son válidas solo para una pestaña a la vez. Las páginas solo se guardan durante el tiempo que la pestaña o el navegador están abiertos; no persisten después de que la página se recarga y restaura. Se crea una nueva sesión cada vez que se abre una pestaña o ventana; esto es diferente de las cookies de sesión. Cada pestaña/ventana que se abre con la misma URL crea su propio almacenamiento de sesión. Cuando duplica una pestaña, el almacenamiento de sesión de la pestaña original se copia en la pestaña duplicada. Cerrar una ventana/pestaña finaliza la sesión y borra los objetos sessionStorage.

El protocolo de una página determina qué datos se almacenan en sessionStorage. En particular, los datos almacenados por scripts a los que se accede a través de HTTP (por ejemplo, http://abc.com) se almacenan en un objeto separado del mismo sitio al que se accede a través de HTTPS (por ejemplo, https://abc.com). Un número DOMString tiene dos bytes por carácter en formato UTF-16 DOMString. Las strings se generan automáticamente a partir de claves enteras tal como lo son para los objetos.

El almacenamiento de sesión tiene 4 métodos:

  • Método setItem(): este método toma dos parámetros, uno es clave y otro es valor. Se utiliza para almacenar el valor en una ubicación particular con el nombre de la clave.
    sessionStorage.setItem(key, value)
  • Método getIteam(): este método toma un parámetro que es clave y se utiliza para obtener el valor almacenado con un nombre de clave particular.
    sessionStorage.getItem(key)
  • Método removeItem(): este método se utiliza para eliminar el valor almacenado en la memoria en referencia a la clave.
    sessionStorage.removeItem(key)
  • Método clear(): este método se utiliza para borrar todos los valores almacenados en el almacenamiento de la sesión.
    sessionStorage.clear()

imagen del almacenamiento de la sesión

Galleta:El término «cookie» se refiere solo a la información textual sobre un sitio web. Para reconocerlo y mostrarle resultados de acuerdo con sus preferencias, este sitio web guarda cierta información en su sistema local cuando visita un sitio web en particular. La historia de Internet ha estado marcada durante mucho tiempo por el uso de cookies. Un visitante del sitio web le pide al servidor una página web cuando la visita. Cada solicitud de un servidor es única. Asimismo, si visitas cien veces, cada solicitud será considerada única por el servidor. Dado que un servidor recibe muchas requests cada segundo, almacenar la información de cada usuario en un servidor no parece lógico ni obvio. Es posible que no se necesite la misma información nuevamente si no regresa. Por lo tanto, se envía una cookie y se almacena en su máquina local para identificarlo de manera única. Recibirá una respuesta del mismo servidor la próxima vez que lo presione, ya que lo reconoce. Casi todos los servidores usan esta cookie (hoy existen algunas excepciones debido a los anuncios). Por lo tanto, aunque pueda tener muchas cookies en su sistema, dichas cookies serán reconocidas por un servidor y analizadas.

Cuando las cookies se desarrollaron por primera vez, se utilizaron para mejorar la experiencia del desarrollador. Considere visitar un sitio web en un idioma que no sea su idioma nativo (digamos inglés). Puede seleccionar inglés como su idioma en la sección de idioma del sitio web. Puede ser necesario cambiar de idioma cinco veces al día si visita el mismo sitio web cinco veces. Por lo tanto, estos detalles se almacenan en una cookie en su sistema. Esto asegura que el servidor sepa que desea ver el sitio web en inglés la próxima vez que envíe una solicitud. Las cookies son vitales en este sentido. Las cookies de escala que se utilizan hoy en día son mucho más pequeñas que en el ejemplo anterior.

imagen de galletas

Diferencia entre almacenamiento local, almacenamiento de sesión y cookies

Almacenamiento local  Almacenamiento de sesiones Galletas 
La capacidad de almacenamiento del almacenamiento local es de 5 MB/10 MB La capacidad de almacenamiento del almacenamiento de la sesión es de 5 MB. La capacidad de almacenamiento de las Cookies es de 4KB
Como no está basado en sesiones, debe eliminarse a través de javascript o manualmente Está basado en sesiones y funciona por ventana o pestaña. Esto significa que los datos se almacenan solo durante una sesión, es decir, hasta que se cierra el navegador (o la pestaña). Las cookies caducan según la configuración y el funcionamiento por pestaña y ventana 
El cliente solo puede leer el almacenamiento local. El cliente solo puede leer el almacenamiento local. Tanto los clientes como los servidores pueden leer y escribir las cookies.
No hay transferencia de datos al servidor. No hay transferencia de datos al servidor. La transferencia de datos al servidor existe.
Hay menos navegadores antiguos que lo admitan. Hay menos navegadores antiguos que lo admitan. Es compatible con todos los navegadores, incluido el navegador anterior.

Publicación traducida automáticamente

Artículo escrito por debadebaduttapanda7 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *