js关于localstore的应用

接到新需求，有客户反映我们的商城首页在点进去商品详情后再返回又要重新划，特别是在分了很多页后，在返回后又要重新一页一页地上拉加载，很累。

前端是API的开发模式，所以对功能的实现有一些限制。

我的想法是：在每加载一次数据的时候，将所有的动态数据存入本地。在返回的时候先判断是否有缓存，如果有缓存就不用ajax请求接口获取数据了，直接将缓存里的数据渲染到页面，如果没有缓存再请求数据。

以下代码：

$(function(){
    if(localStorage.groups_data){
        //获取当前时间戳
        var timestamp = (new Date()).getTime();
        var data = JSON.parse(localStorage.groups_data);
        if(timestamp-data.time>expTime*1000){
            //如果缓存时间超过十分钟，则清除缓存并且重新调用
            localStorage.removeItem("groups_data")
            bindLoad(0)//绑定事件
            return;
        }
        var html = data.data;
        $(".wrap").html(html);
        bindLoad(data.page);//绑定事件
    }else{
        // console.log('无缓存')
        bindLoad(0)//绑定事件
    }

})

//分页加载成功执行的方法，在这里存入页面HTML代码
function success(){
    var timestamp = (new Date()).getTime();
    var html = $(".wrap").html();
    var groupsData = {
        "page":page,//当前页，方便在刷新之后绑定事件事传入页面
        "data":html,
        "time":timestamp//时间戳，存储的时间
    }
    //将对象序列化存储，取出时应反序列化。
    localStorage.setItem("groups_data",JSON.stringify(groupsData));

}