How to make Local Storage expire?
I have a certain scenario in which I need the user to do login and stay logged in for some time. However, if inactivity is detected on the page after a while, maybe about 20 min, The Local Storage invalidating the saved information.
To set a value for an item I use the following code:
localStorage.setItem('login', true);
In this way, the purpose is to keep the user connected until he does logout manually using the code below:
localStorage.removeItem('login');
How do I make local Storage expire after a certain downtime?
3 answers
I would say that if the values are as simple as that, document.cookie would already solve, but you can still do this as localStorage, what you can do is create a vector in json format (maybe) and set in it a deadline date.
And at the beginning of the page, first of all (nor from onload need) add something like:
function localStorageExpires()
{
var toRemove = [], //Itens para serem removidos
currentDate = new Date().getTime(); //Data atual em milissegundos
for (var i = 0, j = localStorage.length; i < j; i++) {
var key = localStorage.key(i),
itemValue = localStorage.getItem(key);
//Verifica se o formato do item para evitar conflitar com outras aplicações
if (itemValue && /^\{(.*?)\}$/.test(itemValue)) {
//Decodifica de volta para JSON
var current = JSON.parse(itemValue);
//Checa a chave expires do item especifico se for mais antigo que a data atual ele salva no array
if (current.expires && current.expires <= currentDate) {
toRemove.push(key);
}
}
}
// Remove itens que já passaram do tempo
// Se remover no primeiro loop isto poderia afetar a ordem,
// pois quando se remove um item geralmente o objeto ou array são reordenados
for (var i = toRemove.length - 1; i >= 0; i--) {
localStorage.removeItem(toRemove[i]);
}
}
localStorageExpires();//Auto executa a limpeza
/**
* Função para adicionar itens no localStorage
* @param {string} chave Chave que será usada para obter o valor posteriormente
* @param {*} valor Quase qualquer tipo de valor pode ser adicionado, desde que não falhe no JSON.stringify
* @param {number} minutos Tempo de vida do item
*/
function setLocalStorage(chave, valor, minutos)
{
var expirarem = new Date().getTime() + (60000 * minutos);
localStorage.setItem(chave, JSON.stringify({
"value": valor,
"expires": expirarem
}));
}
/**
* Função para obter itens do localStorage que ainda não expiraram
* @param {string} chave Chave para obter o valor associado
* @return {*} Retorna qualquer valor, se o item tiver expirado irá retorna undefined
*/
function getLocalStorage(chave)
{
localStorageExpires();//Limpa itens
var itemValue = localStorage.getItem(chave);
if (itemValue && /^\{(.*?)\}$/.test(itemValue)) {
//Decodifica de volta para JSON
var current = JSON.parse(itemValue);
return current.value;
}
}
To use call this:
//login é tua chave, true é teu valor e 25 são os minutos de vida
setLocalStorage('login', true, 25);
To paste use:
var login = getLocalStorage('login');
alert(login);
One way to accomplish this would be to add a function on the screen that validates mouse and key activities with a counter every minute, if it does not make any movement in that 20-minute period it can remove its storage location:
Follows the code in JQuery:
<script>
var tempo = 0;
$(document).ready(function () {
//Valida o Tempo incrementando o valor a cada 1 minuto, caso chegue a 20 sem atividade será eliminada
var idleInterval = setInterval(ValidaTempo, 60000); // 60000 = 1 minuto
//Caso o usuário mova o mouse na aplicação zera o contador
$(this).mousemove(function (e) {
tempo = 0;
});
//Caso o usuário pressione qualquer tecla na aplicação zera o contador
$(this).keypress(function (e) {
tempo = 0;
});
});
//Função que acrescenta ao contador a cada minuto sem atividade e eliminando a local storage.
function ValidaTempo() {
//Acrescenta cada minuto sem atividade
tempo = tempo + 1;
//Caso o tempo seja maior que 19 minutos ele encerra a sessão
if (tempo > 19) { // 20 minutos
localStorage.removeItem('login');
//redireciona login
}
}
I hope it may have helped. ;)
Unfortunately there is no attribute that removes the localStorage item when it expires.
There are different ways to do this if you are using AngularJS 1.X you can do something this way:
app.run(function($interval){
$interval( function(){
delete localStorage[key];
//remove todos os objetos com a 'key' informada.
}, 1000*60*20);
});