自定义办法设置 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})

在ios设备上无法重复setItem()

另外，在iPhone/iPad上有时设置setItem()时会出现诡异的QUOTA_EXCEEDED_ERR错误，这时一般在setItem之前，先removeItem()就ok了。