LocalStorage siempre se almacenará en el navegador a menos que se borre manualmente. Sin embargo, en muchos casos es posible que necesitemos que localStorage tenga una fecha de vencimiento. Por ejemplo, si guardamos el token de autenticación del usuario en el cliente, será válido dentro de 1 semana. , y si excede una semana, inicie sesión nuevamente, ¿cómo cumplir con este requisito?
Debe saber que localStorage en sí no proporciona un mecanismo de caducidad. En este caso, solo podemos implementarlo nosotros mismos. Podemos agregar dicho método directamente a su prototipo.
Storage.prototype.setExpire=(clave,valor,expire) =>{ };Storage.setExpire(clave,valor,expire);
Para caducar, se debe registrar la hora. Nuestra idea es registrar la hora actual al establecer el valor y luego, al obtener el valor, juzgar si la diferencia entre la hora actual y la hora anterior está dentro de un cierto rango. fuera del rango, borre el elemento actual y devuelve nulo.
Para agregar tiempo a un valor, se debe definir un formato.
Storage.prototype.setExpire=(clave, valor, caducar) =>{ let obj={ datos:valor, hora:Fecha.now(), caducar:caducar localStorage.setItem(clave,JSON.stringify(obj)) ;}
Incluye los siguientes 3 campos
Debido a que el valor establecido por localStorage no puede ser un objeto, aquí se usa el método JSON.stringify para convertirlo en una cadena y se debe volver a convertir cuando se usa.
Luego agregamos un método para obtener
Storage.prototype.getExpire= clave =>{ let val =localStorage.getItem(key); if(!val){ return val } val =JSON.parse(val); >val.expire){ localStorage.removeItem(clave); devolver nulo } devolver val.data;}
Podemos probarlo primero.
localStorage.setExpire(token,'xxxxxx',5000);window.setInterval(()=>{ console.log(localStorage.getExpire(token));},1000)
Esencialmente, nuestra idea no es limpiar los artículos vencidos con regularidad, sino determinar si están vencidos cuando se obtienen y luego borrarlos si están vencidos.
Lo anterior es el contenido completo de este artículo. Espero que sea útil para el estudio de todos. También espero que todos apoyen VeVb Wulin Network.