Web Storage - Armazenamento de dados

Preview:

Citation preview

Armazenamento de dadoscom localStorage e sessionStorage

Jackson VeronezeSoftware Developer

jackson@jacksonveroneze.comhttps://jacksonveroneze.comhttps://br.linkedin.com/in/jacksonveroneze

Mario MendonçaSoftware Developer

mario.mendonca@gmail.comhttps://br.linkedin.com/in/mario-mendonca

Autores

Entendendo os Cookies e Sessões

Os cookies são “persistências temporárias” feitas no lado do usuário, e sessões são persistências dependentes de cookies, mas realizadas no lado do servidor.

Cookies

Através de cookies o servidor Web é capaz de trocar informações de estado com o navegador do usuário. Ex.: Carrinho de compras.

Tecnicamente falando, um cookie é uma pequena quantidade de informação persistida temporariamente pelo navegador. Os navegadores normalmente limitam o tamanho dos cookies em até 4KB, e apagam cookies com a data de “validade vencida”.

Exemplo

Sessões

As sessões têm um princípio similar aos cookies, só que o armazenamento do estado é feito pelo servidor Web, e não pelo navegador.

Por exemplo, uma aplicação que necessita de autenticação. Dados “sensíveis”, como usuário e e-mail, são mais interessantes de serem guardadas em sessões. Isto, pois não é seguro que esse tipo de informação fique “viajando” pela Web.

Exemplo

LocalStorage

O localStorage salva dados no computador do visitante, que ficam vinculados ao (e apenas acessíveis pelo) seu domínio. E para usar é bem simples:

Use o método setItem(nome, valor) para criar/salvar novos itens e o depois o método getItem(nome) para recuperar o valor.

LocalStorage

Local storage é persistente; Ele armazena dados sem data de expiração.

Local storage é muito semelhante aos cookies exceto por algumas diferenças importantes, como:

permite muito mais espaço de armazenamento.

é transmitido apenas mediante pedido. Isto significa que podemos armazenar grandes quantidades de dados sem afetar o desempenho do site.

Exemplo

Limites do LocalStorage

Segundo a especificação da W3C, ela sugere(não é obrigatório) que o espaço reservado por origem seja de 5MB e no futuro esse limite pode ser atualizado, a origem citada anteriormente no caso é por cada domínios.

SessionStorage

É um mecanismo que foi projetado com a finalidade de armazenar dados para transação em um documento HTML, isto é, para cada novo documento HTML, é criada uma área de armazenamento de dados independente.

Exemplo

Suporte

Conclusão

Ambos localStorage e sessionStorage se extendem de Storage. Não há diferença entre eles, exceto para a não-persistência de sessionStorage.

Utilize localStorage para uso a longo prazo e sessionStorage quando você precisa armazenar algo temporário(i.e. dados de uma sessão). Ambos também são escopo por fabricantes de navegadores.

Recommended