localStorage的过期时间设置的方法

谁借莪１个温暖的怀抱￠ 2022-04-15 00:46 542阅读 0赞

版权声明： https://blog.csdn.net/xyphf/article/details/51830770

**我们都知道localStorage不主动删除,永远不会销毁，那么如何设置localStorage的过期时间呢，今天我们来一起尝试一下！**

<script type="text/javascript"> //封装过期控制代码 function set(key,value){ var curTime = new Date().getTime(); localStorage.setItem(key,JSON.stringify({data:value,time:curTime})); } function get(key,exp){ var data = localStorage.getItem(key); var dataObj = JSON.parse(data); if (new Date().getTime() - dataObj.time>exp) { console.log('信息已过期'); //alert("信息已过期") }else{ //console.log("data="+dataObj.data); //console.log(JSON.parse(dataObj.data)); var dataObjDatatoJson = JSON.parse(dataObj.data) return dataObjDatatoJson; } } </script>
     
      
       1
       2
       3
       4
       5
       6
       7
       8
       9
       10
       11
       12
       13
       14
       15
       16
       17
       18
       19
       20

使用场景：  
1.利用本地数据,减少网络传输  
2.弱网络环境下，高延迟,低带宽,尽量把数据本地化

使用方法：

<script>
    window.onload = function(){
        var Ipt = document.getElementById('input1');
        var value = '{"name":"和派孔明","Age":"18","address":"陆家嘴金融城"}';
        set('information',value);
    
        Ipt.onclick = function(){
            //var dataObjData=get('information',1000);//过期时间为1秒,正常情况下，你点击的时候已经过期
            //var dataObjData=get('information',1000*60);//过期时间为1分钟
            //var dataObjData=get('information',1000*60*60);//过期时间为1小时
            //var Obj=get('information',1000*60*60*24);//过期时间为24小时
            var dataObjData=get('information',1000*60*60*24*7);//过期时间为1周
            console.log(dataObjData || null);
                if (dataObjData!="" && dataObjData!=null) {
                        console.log("姓名:"+dataObjData.name);
                        console.log("年龄:"+dataObjData.Age );
                        console.log("地址:"+dataObjData.Age );
                }else{
                    alert("获取的信息已经过期");
                }   
        }
    }
    </script>
     
      
       1
       2
       3
       4
       5
       6
       7
       8
       9
       10
       11
       12
       13
       14
       15
       16
       17
       18
       19
       20
       21
       22
       23

**localStorage过期控制运行代码结果之未过期**  
![localStorage过期控制运行代码结果之未过期][localStorage]

**localStorage过期控制运行代码结果之已过期**  
![localStorage过期控制运行代码结果之已过期][localStorage 1]

[localStorage]: /images/20220415/f2d146c8b5f64c3b9ca89901058b22fa.png
[localStorage 1]: /images/20220415/dede375770c74c33a7ffe8108ef95217.png

发表评论取消回复

表情：

评论列表（有 0 条评论，542人围观）

还没有评论，来说两句吧...

相关阅读

相关 redis设置过期时间

果是使用spring-data-redis的话项目中注入 RedisTemplate * setExpire() setExpire1() 都可以设置过期时间 ...

不念不忘少年蓝@/ 2024年04月17日 21:41/ 0 赞/ 80 阅读

相关 java设置redis过期时间的方法

springboot中操作redis 1、引入pom依赖  <dependency>

雨点打透心脏的1/2处/ 2024年04月01日 14:13/ 0 赞/ 63 阅读

相关 PHP中设置会话（Session）过期时间的方法

会话（Session）是在PHP中用于存储用户状态和数据的机制。默认情况下，PHP会话在用户关闭浏览器时过期。但是，有时候我们可能需要手动设置会话的过期时间，以便使会话在一定的

绝地灬酷狼/ 2024年02月28日 01:47/ 0 赞/ 52 阅读

相关设置session过期时间

一、 web app server中，如websphere里可以设置超时时间为30分钟二、在web.xml中的session-config配置 sessi

分手后的思念是犯贱/ 2024年02月17日 15:29/ 0 赞/ 68 阅读

相关 localStorage的过期时间设置的方法？

我们都知道localStorage不主动删除,永远不会销毁，那么如何设置localStorage的过期时间呢，今天我们来一起尝试一下！ <script type="t

矫情吗；*/ 2023年10月17日 14:36/ 0 赞/ 83 阅读

相关封装的localStorage、sessionStorage的存取函数，可以配置过期时间

/ localStorage @调用：_local.set('access_token', '123456', 5000); @调用

r囧r小猫/ 2023年01月05日 12:07/ 0 赞/ 148 阅读

相关 localStorage的过期时间设置的方法

版权声明： https://blog.csdn.net/xyphf/article/details/51830770 我们都知道localStorage不主动删除,永远不会销

谁借莪１个温暖的怀抱￠/ 2022年04月15日 00:46/ 0 赞/ 543 阅读

相关封装带过期时间的localStorage

// 封装一个localStorage函数,减少页面请求 export function Storage() { if (!window.loc

傷城~/ 2021年11月17日 21:24/ 0 赞/ 297 阅读

相关 Redis设置过期时间

Redis 设置过期时间 Redis中有个设置时间过期的功能，就是对存储在Redis 数据库中的值可以设置一个过期时间。作为一个缓存数据库，这是非常实用的。比

待我称王封你为后i/ 2021年11月11日 11:02/ 0 赞/ 476 阅读

相关 thinkphp 5 , tp5的 session过期时间设置方法

网站有后台与前台应用目录,后台如果为application/admin 前台如果为application/index 那么, 他们一般会在单独的应用目录中设置config.

不念不忘少年蓝@/ 2021年09月27日 04:48/ 0 赞/ 1224 阅读