Code Monkey home page Code Monkey logo

jquery-ajax-cache's Introduction

jquery-ajax-cache

Build Status Circle CI npm

jquery-ajax-cache 插件扩展了jQuery的$.ajax,提供非常便利的方式缓存ajax请求到‘localStorage’或‘sessionStorage’中。你唯一要做的就是实现cacheValidate方法,验证返回结果是否需要缓存。页面加载和数据读写过程插件都会进行过期数据清除,避免过期数据的堆积。同时你也可以调用$ajaxCache.deleteAllExpires()手动清除过期缓存。

Why jquery-ajax-cache?

优点

1、使用简单!
2、还是使用简单!!
3、重要事情3遍,简单!!!
4、最大可能的清除过期数据,避免溢出

下载

下载 最新 jquery-ajax-cache

bower

bower install jquery-ajax-cache

npm

npm install jquery-ajax-cache --save-dev

引入

<script src="../node_modules/jquery/dist/jquery.js"></script>
<script src='../dist/jquery-ajax-cache.min.js'></script>

使用

全局配置

$ajaxCache.config({
    // 业务逻辑判断请求是否缓存, res为ajax返回结果, options 为 $.ajax 的参数
    cacheValidate: function (res, options) {    //选填,配置全局的验证是否需要进行缓存的方法,“全局配置” 和 ”自定义“,至少有一处实现cacheValidate方法
        return res.state === 'ok';
    },
    storageType: 'localStorage', //选填,‘localStorage’ or 'sessionStorage', 默认‘localStorage’
    timeout: 60 * 60, //选填, 单位秒。默认1小时
});

简单使用

$.ajax({
    // 使用时 只要增加给ajax请求增加一行属性   ajaxCache: true
    ajaxCache: true     // “全局配置” 和 ”自定义“,至少有一处实现cacheValidate方法
    /*
     others...
    */
});

自定义

$.ajax(
    // 此处的参数会覆盖‘全局配置’中的设置
    ajaxCache: {
        // 业务逻辑判断请求是否缓存, res为ajax返回结果, options 为 $.ajax 的参数
        cacheValidate: function (res, options) { //选填,配置全局的验证是否需要进行缓存的方法, “全局配置” 和 ”自定义“,至少有一处实现cacheValidate方法
            return res.state === 'ok' && res.code ==='200';
        },
        storageType: 'localStorage', //选填,‘localStorage’ or 'sessionStorage', 默认‘localStorage’
        timeout: 60 * 60, //选填, 单位秒。默认1小时,
        forceRefresh: false //选填,默认false 是否强制刷新请求。本次请求不读取缓存,同时如果请求成功会更新缓存。应用场景如:下拉刷新
    }
});

清除过期数据

无特殊情况无需主动调用,插件会自动清除过期数据

$ajaxCache.deleteAllExpires();

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.