AJAX请求 JSON数据并实现本地缓存

本文主要介绍通过ajax请求json数据，并实现数据的本地存储，以下面的实例为例:

• 请求新闻列表时判断ajax请求是否成功
• 请求失败读取本地缓存信息,请求成功是判断res.code
• 当res.code不为1000000时依旧读取缓存,否则更新页面数据并更新缓存
• 以下为部分代码

$('.nowDay').html(date);
    var detailUrl = 'sentiment/index.php/news/today-news/list';
    var url = _baseUrl_ + detailUrl;
    $.ajax({
        url: url,
        data:{
            day:date
        },
        type: "GET",
        dataType: 'jsonp',
        jsonp: 'callback',
        jsonpCallback: "listDataRender",
        success: function (res) {
            if(res.code == 1000000){
                // 序列化转化成json字符串
                localStorage.setItem('res',JSON.stringify(res));
                console.log(res.list)
            }
        },
        error: function () {
            console.log('1111')
            // 判断本地是否有缓存
            if(localStorage.getItem('res') == null || localStorage.getItem('res') == undefined) {

                console.log(localStorage.getItem('res'))
                alert('您的网络出现异常，请稍后再试!')
            }
            else {
                res = localStorage.getItem('res')
                listDataRender(res)
            }
            // alert('您的网络出现异常，请稍后再试!')
        }


    })


}

function listDataRender(res) {


    if (res.code == 1000000) {
        _newsAll_ = [].concat(res.list);
        if (_newsAll_.length >= _pageNumber_) {
            renderList(_newsAll_.splice(0, _pageNumber_),true);
        }
        else {
            isOver=true;
            renderList(_newsAll_,false);
        }
        $('.allNum').html(res.list.length);

    }
    else {
        //反序列化 将字符串转化成json对象
        res = JSON.parse(localStorage.getItem('res'))
        // console.log(res)
        _newsAll_ = [].concat(res.list);
        // console.log(_newsAll_)
        if (_newsAll_.length >= _pageNumber_) {
            renderList(_newsAll_.splice(0, _pageNumber_),true);
        }
        else {
            isOver=true;
            renderList(_newsAll_,false);
        }
        $('.allNum').html(res.list.length);
        // alert('您网络异常，请稍后再试！')
    }


}