Há duas maneiras de armazenar dados do lado do cliente com o Web Storage: sessionStoragee localStorage.
sessãoArmazenamento
sessionStorageé projetado para manter os dados do lado do cliente apenas durante a sessão de navegação.
Em outras palavras, os dados são armazenados apenas enquanto o usuário estiver em seu site. sessionStorage, na prática, é melhor usado para armazenamento temporário de dados. Por exemplo, os valores inseridos pelo usuário de campos de formulário da web podem ser armazenados temporariamente em um sessionStorageobjeto durante a sessão de navegação do usuário.
Dessa forma, os dados estão disponíveis durante toda a experiência de navegação sem a necessidade de armazenar os dados em um sistema de banco de dados do lado do servidor. Além disso, o armazenamento temporário de dados de entrada protege o usuário de ter que reinserir os dados, caso ele feche ou atualize acidentalmente a janela do navegador.
armazenamento local
Em termos de implementação, localStoragefunciona da mesma maneira que o sessionStorage. localStoragecompartilha os mesmos métodos JavaScript (por exemplo, getItem, setItem, etc.), e também armazena itens de dados como pares de chave/valor. No entanto, armazenar dados como um localStorageobjeto significa que os dados persistirão entre as sessões do usuário. Em outras palavras, os dados estarão disponíveis na próxima vez que o usuário visitar seu site.
Suporte ao navegador de armazenamento da Web
Caniuse.com relata que o Web Storage tem um bom suporte ao navegador.
Atualmente, a especificação de armazenamento da Web é uma recomendação candidata do W3C .
Existem 5 níveis de recomendações, e “Recomendação do Candidato” é o terceiro dos cinco níveis. A especificação de armazenamento da Web existente é bastante madura porque não é mais um rascunho de trabalho, mas, ao mesmo tempo, ainda não é final. O suporte a navegadores antigos que não possuem recursos de armazenamento na Web pode ser feito com o uso de um polyfill.
Uma dessas opções, para localStoragesuporte, é Store.js .
Privacidade de dados e considerações de segurança
As áreas de armazenamento da Web estão sujeitas à mesma política de restrição de origem que os cookies. Isso significa que as áreas de armazenamento na Web de um site não podem ser acessadas por outros sites. Isso é benéfico para a segurança dos dados.
Mas também pode causar problemas para sites que dependem de subdomínios. Nesse caso, existem soluções alternativas disponíveis, como o pacote de código aberto chamado Cross-Storage desenvolvido pela Zendesk. Assim como com qualquer mecanismo de armazenamento de dados do lado do cliente, proteger os dados armazenados é uma consideração importante.
O armazenamento de dados pessoais ou confidenciais não é recomendado. É potencialmente fácil para outras pessoas que têm acesso ao dispositivo ler dados locais. Considere com cuidado extra o armazenamento de dados em situações em que seus usuários possam acessar seu site em ambientes de computação compartilhados, como faculdades, bibliotecas, computadores de trabalho e assim por diante.
A integridade dos dados também é uma preocupação. Deve haver proteções contra cenários em que um evento de armazenamento de dados falhe. A falha pode ocorrer quando o usuário desativou o Armazenamento na Web, ou se ele não tiver mais espaço de armazenamento disponível no computador, ou se o limite de tamanho do Armazenamento na Web do seu navegador for excedido.
A especificação Web Storage descreve erros/avisos padronizados que são emitidos após eventos de armazenamento com falha, como a QuotaExceededErrorexceção.