Html5 e armazenamento local

O mecanismo de armazenamento local é um bom substituto para bolinhos, e com HTML5, você pode escrever até 5MB de dados para um arquivo especial no cliente. Este arquivo não é executável e não pode conter dados binários (apenas cordas), por isso é razoavelmente seguro.

Todas as páginas que vêm de seu domínio partilham a mesma área de armazenamento, assim você pode usar esse mecanismo para manter os dados persistentes entre várias páginas. Os dados também permanece na máquina do cliente (até que você removê-lo), por isso pode ser usado para manter o controle de informações ao longo do tempo.

o localStorage atributo é um exemplo de um tipo muito simples (mas forte) de estrutura de dados denominada dicionário. Você já usou dicionários muitas vezes como um desenvolvedor Web. Cada pedaço de dados é armazenado em um valor chave par. A chave identifica o nome da informação (dizer ‘firstName’), e o valor é o valor associado a essa chave ( ‘Herbert’).

atributos HTML são dicionários (em https://google.comgt;, href é a chave, e https://google.com é o valor). regras CSS também são dicionários. (Na regra de estilo cor vermelha-, cor é a chave, e vermelho é o valor.) Algumas linguagens de programação usar nomes diferentes para dicionários, incluindo arrays associativos e tabelas hash.

O acesso ao armazenamento local é através de um objeto embutido especial chamado localStorage (). Essa classe tem um número relativamente pequeno de métodos, mas eles são extremamente poderoso e fácil de usar:

  • localStorage.setItem (chave, valor): Armazena um valor associado com uma chave. Essencialmente, chave é como um nome de variável, e valor é o valor associado a essa chave. Você pode armazenar qualquer tipo de valor que você quer, mas vai ser armazenados como dados de cadeia.

  • localStorage.getItem (chave): Recupera o valor associado com a chave. Mais uma vez, você pode pensar a chave como um nome de variável. Note que este método sempre retorna um valor cadeia, então você pode precisar para converter os dados para outro tipo. Se a chave não existir, você receberá o valor especial nulo.



  • localStorage.removeItem (chave): Remove um item do armazenamento. A chave e o valor, ambos serão removidos. Isso pode ser útil se você estiver executando fora do espaço. Você está alocado única 5MB de espaço, e uma vez que ele está cheio, você não pode adicionar qualquer outra coisa.

  • localStorage.length: Retorna o número de pares de chave / valor no banco de dados. Geralmente utilizado num circuito com o chave() método para trabalhar com cada par chave / valor.

    Video: HTML5 - Aula 22 - WebStorage

  • localStorage.key (i): Dado um número inteiro Eu, este método encontra a chave correspondente. Note que a ordem das chaves não é garantida. Normalmente, este método é usado em um loop para recuperar todas as chaves no banco de dados. Em seguida, cada tecla é utilizada para procurar o valor correspondente.

  • localStorage.clear (): Limpa todos os pares de chave / valor de localStorage. Este é um comando potencialmente destrutivo, então pense com cuidado antes de usá-lo. Por definição, localStorage dados não é feito o backup no servidor (ou em qualquer outro lugar). Uma vez que ele se foi, ele realmente se foi.

    Video: aula 4946 html5 css3 js Armazenamento de dados Web Storage SessionStorage setItem getItem

Se você tentar armazenar mais de 5 MB de dados do mesmo domínio, javascript irá lançar um “QUOTA_EXCEEDED_ERR” exceção. Não há atualmente nenhuma maneira de mudar a quantidade de armazenamento permitido, mesmo com a permissão do usuário.

Surpreendentemente, o mecanismo de armazenamento local funciona muito bem em todos os navegadores atuais, até mesmo Internet Explorer.

Claro, qualquer momento uma página da Web pode gravar dados para a máquina do cliente, existe alguma preocupação com a privacidade e segurança. No entanto, os dados são armazenados na máquina do cliente, por isso nunca é transmitida ao servidor (ao contrário de dados do cookie). Os dados são armazenados na máquina do cliente e pertence ao cliente. O limite de 5 MB dá uma boa quantidade de espaço para aplicações Web, mas mesmo se ela está cheia, não vai entupir máquinas modernas. Finalmente, os dados são armazenados em um formato de texto simples, e não pode ser colocado em um arquivo separado - por isso seria difícil de usar essa tecnologia para criar vírus e outras pragas de código problemático.

Pode parecer limitante para armazenar dados nestes pares nome / valor simples, mas você pode realmente armazenar dados muito complexos utilizando este mecanismo. O valor pode ser qualquer tipo, incluindo o XML muito rica e mecanismos de armazenamento de dados JSON.


Publicações relacionadas