How do I get Local Storage to expire?

5

I have a certain scenario where I need the user to be login and stay connected for some time. However, if page inactivity is detected after a time, perhaps 20 minutes, 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 intention is to keep the user logged on until he logs in manually using the code below:

localStorage.removeItem('login'); 

How do I get Local Storage to expire after a certain downtime?

    
asked by anonymous 22.01.2017 / 19:22

3 answers

6

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) date limit.

And at the beginning of the page, first of all (and ofload onload) 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 current = localStorage.getItem(localStorage.key(i));

       //Verifica se o formato do item para evitar conflitar com outras aplicações
       if (current && /^\{(.*?)\}$/.test(current)) {

            //Decodifica de volta para JSON
            current = JSON.parse(current);

            //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

To declare and get the items:

//Declare isto
function setLocalStorage(chave, valor, minutos)
{
    var expirarem = (new Date().getTime()) + (60000 * minutos);

    localStorage.setItem(chave, JSON.stringify({
        "value": valor,
        "expires": expirarem
    });
}

function getLocalStorage(chave)
{
    localStorageExpires();//Limpa itens

    var itemValue = localStorage[chave];

    if (itemValue && /^\{(.*?)\}$/.test(itemValue)) {

        //Decodifica de volta para JSON
        var current = JSON.parse(itemValue);

        return current.value;
    }

    return false;
}

To use call like this:

//login é tua chave, true é teu valor e 25 são os minutos de vida
setLocalStorage('login', true, 25);

To get use:

var login = getLocalStorage('login');

alert(login);
    
23.01.2017 / 14:51
1

One way to do this would be to add a function on the screen that validates the mouse and keyboard activities with a counter every minute, if it does not make any movement in that 20 minute period it can remove its local Storage:

Follow 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 you have helped. ;)

    
22.01.2017 / 20:24
0

Unfortunately, there is no attribute that removes the item from localStorage when it expires.

There are different ways of doing this, if you are using AngularJS 1.X you can do something like this:

app.run(function($interval){
  $interval( function(){
    delete localStorage[key];
    //remove todos os objetos com a 'key' informada.
  }, 1000*60*20);
});
    
22.01.2017 / 21:13