JavaScript

Quando a localStorage expira? Como remover elementos depois de um tempo

23 de julho de 2022

Quando a localStorage expira? Como remover elementos depois de um tempo

Neste artigo você vai aprender quando a localStorage expira, e também a remover um item depois de um determinado tempo

Quando a localStorage expira capa

Fala programador(a), beleza? Bora aprender mais sobre a localStorage!

Os itens que estão salvos na localStorage não expiram, eles ficam lá para sempre

Ou até haver alguma intervenção nossa e excluirmos manualmente

Se você precisa que os dados expirem após fechar a aba do navegador, utilize a sessionStorage

Você pode aprender mais sobre eles objetos neste vídeo:

E para expirar depois de um tempo o dado na localStorage podemos criar um pequeno snippet

Veja um código de exemplo:

const expirationTime = 6; // Em horas

const currentHour = new Date().getTime();

const expirationTime = localStorage.getItem('expirationTime');

if (expirationTime === null) {

    localStorage.setItem('expirationTime', currentHour)

} else {

    const expirationCalc = now - setupTime > hours * 60 * 60 * 1000

    if(expirationCalc) {
        localStorage.clear()
        localStorage.setItem('setupTime', now);
    }

}

Priemeiramente definimos em quantas horas será a expiração

Depois pegamos a hora atual com Date

E por fim verificamos se há o item de expiração na localStorage

Se não houver inserimos o parâmetro de expiração como a hora atual (currentHour)

E se houver identificamos se já passou da quantidade de horas que escolhemos, isso é feito no cálculo da variável expirationCalc

Se o resultado for verdadeiro removemos tudo na localStorage e começamos a contar novamente o tempo

Conclusão

Neste artigo vimos que precisamos determinar quando a localStorage expira, pois os dados permanecem lá para sempre

Foi preciso realizar um cálculo baseado em um tempo de expiração pré determinado por nós

Aqui escolhemos fazer por horas, mas fique a vontade para alterar de acordo com as suas necessidades

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias! Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias. O link acima contém um cupom de desconto para os cursos

Subscribe
Notify of
guest

0 Comentários
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x