自定义办法设置 localStorage 过期时间

在 web 开发中，我们知道 cookie、session、localStorage 都可以保存用户的数据，cookie的 domain、path 限制了 cookie 的跨域， 有数量和大小的限制，可以设置有效时间。 session是后台在浏览器注入一个设置了 httponly 的不可读取的 cookie ， session data由后台保存在数据库或者内存中，在web中，session 是靠 cookie 作为唯一标示来实现的，也可以设置过期时间。localStorage 是 H5 的数据存储办法， 也是有大小限制的，但是不可以设置过期时间。 本文主要说的是如何自定义办法让localStorage 实现过期时间。

---------------------------------------------------------------------------------------------

module.exports = {

// 过期时间，默认30天

age: 30*24*60*60*1000,

/**

* 设置过期时间

* @param age

* @returns {exports}

*/

setAge: function(age){

this.age = age;

return this;

},

/**

* 设置 localStorage

* @param key

* @param value

*/

set: function(key, value){

localStorage.removeItem(key);

var isObject = value instanceof Object,

_time = new Date().getTime(),

_age = this.age;

// 如果不是对象，新建一个对象把 value 存起来

if(!isObject) {

var b = value;

value = {};

value._value = b;

}

// 加入时间

value._time = _time;

// 过期时间

value._age = _time + _age;

// 是否一个对象

value._isObject = isObject;

localStorage.setItem(key, JSON.stringify(value));

return this;

},

/**

* 判断一个 localStorage 是否过期

* @param key

* @returns {boolean}

*/

isExpire: function(key) {

var isExpire = true,

value = localStorage.getItem(key),

now = new Date().getTime();

if(value) {

value = JSON.parse(value);

// 当前时间是否大于过期时间

isExpire = now > value._age;

} else {

// 没有值也是过期

}

return isExpire;

},

/**

* 获取某个 localStorage 值

* @param key

* @returns {*}

*/

get: function(key) {

var isExpire = this.isExpire(key),

value = null;

if(!isExpire) {

value = localStorage.getItem(key);

value = JSON.parse(value);

if(!value._isObject) {

value = value._value;

}

}

return value;

}

};

使用方法：

var localstorage = require('./localstorage.js');

localstorage.setAge(24*60*60*1000).set('a': 'abc').set('b',{a:1,b:2})

---------------------------------------------------------------------

更多全栈技术类交流请关注微信公众号：放牛极客（geekcattle）