Almacenamiento web

El almacenamiento web , anteriormente conocido como almacenamiento DOM ( almacenamiento del Modelo de Objetos del Documento ), es una API estándar de JavaScript proporcionada por los navegadores web . Permite a los sitios web almacenar datos persistentes en los dispositivos de los usuarios, de forma similar a las cookies , pero con una capacidad mucho mayor ^{[ 1 ]} y sin enviar información en las cabeceras HTTP . ^{[ 2 ]} Existen dos tipos principales de almacenamiento web: almacenamiento local y almacenamiento de sesión, que se comportan de forma similar a las cookies persistentes y de sesión, respectivamente. El almacenamiento web está estandarizado por el Consorcio World Wide Web (W3C) ^{[ 3 ]} y WHATWG , ^{[ 4 ]} y es compatible con todos los navegadores principales.

El almacenamiento web se diferencia de las cookies en algunos aspectos clave.

Los navegadores que admiten almacenamiento web tienen los objetos globales sessionStoragey localStoragese declaran a nivel de ventana. El siguiente código JavaScript se puede usar en estos navegadores para activar el comportamiento de almacenamiento web:

// Almacena el valor en el navegador durante la duración de la sesión sessionStorage.setItem ( " key" , "value" );// Recuperar valor (se elimina cuando se cierra y se vuelve a abrir el navegador) ... alert ( sessionStorage . getItem ( "key" ));// Almacena el valor en el navegador más allá de la duración de la sesión localStorage.setItem ( "key" , "value" );// Recuperar valor (persiste incluso después de cerrar y volver a abrir el navegador) alert ( localStorage . getItem ( "key" ));

Solo se pueden almacenar cadenas a través de la API de almacenamiento. ^{[ 11 ]} Intentar almacenar un tipo de dato diferente dará como resultado una conversión automática a cadena en la mayoría de los navegadores. Sin embargo, la conversión a JSON permite un almacenamiento eficaz de objetos JavaScript.

// Almacena un objeto en lugar de una cadena localStorage.setItem ( " key" , { name : " value" }); alert ( typeof localStorage.getItem ( 'key' )); // cadena// Almacena un entero en lugar de una cadena localStorage.setItem ( "key" , 1 ); alert ( typeof localStorage.getItem ( " key" )); // cadena// Almacenar un objeto usando JSON localStorage.setItem ( " key" , JSON.stringify ({ name : " value" } )); alert ( JSON.parse ( localStorage.getItem ( " key " ) ). name ); // valor

El borrador del W3C se titula "Almacenamiento web". "Almacenamiento DOM" también ha sido un nombre de uso común, aunque cada vez se usa menos; por ejemplo, los artículos web sobre "Almacenamiento DOM" de los sitios para desarrolladores de Mozilla y Microsoft han sido reemplazados por artículos sobre "Almacenamiento web". ^{[ 12 ] [ 13 ] [ 14 ] [ 15 ]}

El término "DOM" en almacenamiento DOM no se refiere literalmente al Modelo de Objeto de Documento . Según el W3C, "el término DOM se utiliza para referirse al conjunto de API disponibles para los scripts en las aplicaciones web, y no implica necesariamente la existencia de un objeto Documento real..." ^{[ 16 ]}

El almacenamiento de objetos de almacenamiento web está habilitado de forma predeterminada en las versiones actuales de todos los navegadores web compatibles. Los proveedores de navegadores ofrecen a los usuarios la posibilidad de habilitar o deshabilitar el almacenamiento web, o de borrar la caché. También existen controles similares sobre el almacenamiento web a través de extensiones de navegador de terceros . Cada navegador almacena los objetos de almacenamiento web de forma diferente.

• Firefox guarda los objetos de almacenamiento web en un archivo SQLitewebappsstore.sqlite ubicado en la carpeta de perfil del usuario. ^{[ 17 ]}
• Google Chrome registra los datos de almacenamiento web en un archivo SQLite en el perfil del usuario. La subcarpeta que contiene este archivo es " \AppData\Local\Google\Chrome\User Data\Default\Local Storage" en Windows y " ~/Library/Application Support/Google/Chrome/Default/Local Storage" en macOS .
• El almacenamiento web de Opera\AppData\Roaming\Opera\Opera\sessions\autosave.win se encuentra en " " o " \AppData\Local\Opera\Opera\pstorage\" dependiendo de la versión de Opera.
• El almacenamiento web de Internet Explorer\AppData\LocalLow\Microsoft\Internet Explorer\DOMStorage es " ".
• El almacenamiento web de SafariLocalStorage se encuentra en una carpeta etiquetada como " " dentro de una carpeta oculta " safari". ^{[ 18 ]}

• API de base de datos indexada

• HTML Living Standard 11 Almacenamiento web
• W3C: Almacenamiento web
• API de almacenamiento web en la red de desarrolladores de Mozilla
• Opera: Almacenamiento web: almacenamiento de datos del lado del cliente más sencillo y potente
• Almacenamiento local en BlackBerry DevZone