javascript – How to make Local Storage expire?

Question:

I have a certain scenario where I need the user to log in and stay logged in for awhile. However, if inactivity is detected on the page after a while, maybe 20 min, theLocal Storage expires 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 in until he logs out manually using the code below:

localStorage.removeItem('login'); 

How to make Local Storage expire after a certain time of inactivity?

Answer:

I would say that if the values ​​are that simple, the document.cookie would solve it, but you can still do it like localStorage , what you can do is create a vector in json format (maybe) and set a date to limit it.

And at the top of the page, first of all (not even onload needed) 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 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);