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

矫情吗；* 2023-10-17 14:36 81阅读 0赞

**我们都知道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 
        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 
       
      
      
       
        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]

来源:http://blog.csdn.net/xyphf/article/details/51830770

[localStorage]: https://img-blog.csdn.net/20160705132111382
[localStorage 1]: https://img-blog.csdn.net/20160705132356071

发表评论取消回复

表情：

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

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

相关阅读

相关 redis设置过期时间

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

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

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

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

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

相关 JS--localStorage设置过期时间的方案(有示例)

原文网址：[JS--localStorage设置过期时间的方案(有示例)\_IT利刃出鞘的博客-CSDN博客][JS--localStorage_IT_-CSDN] 简介

蔚落/ 2024年03月30日 11:39/ 0 赞/ 47 阅读

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

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

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

相关设置session过期时间

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

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

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

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

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

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

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

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

相关封装带过期时间的localStorage

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

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

相关 Redis设置过期时间

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

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

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

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

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