8

if we pass true for cache in $.ajax() the jquery will cache the loaded data, I want to know is there any way to change the cache time for $.ajax() ? for example if ajax requested in 10 minutes the jquery load previous data but if requested after 10 minutes load fresh data.

UPDATE :

We need cache the JSON data, so I should use Ajax in JSON datatype

4

2 回答 2

7

jQuery 实际上并不为您缓存请求 - 当您设置cache为时false，它只是设置一些标头并传递一个“缓存破坏器”查询字符串变量（例如，?_=487262189472）以防止浏览器或任何代理返回缓存的响应。

如果你想要 10 分钟的缓存，你可以很容易地实现你自己的缓存。例如，

var cacheBuster = new Date().getTime();
setInterval(function() {
    cacheBuster = new Date().getTime();
}, 1000 * 60 * 10)

然后只需将其添加到您的请求中的查询字符串变量中（例如，?_noCache=<cacheBuster>）。

编辑：为了使它成为一个更完整的解决方案，这里有一个示例，说明如何cacheBuster在所有 jQuery Ajax 请求上对实际的 Ajax 调用透明地使用：

$.ajaxPrefilter(function (options, originalOptions, jqXHR) {
    var startChar = options.url.indexOf('?') === -1 ? '?' : '&';
    options.url += startChar + '_noCache=' + cacheBuster;
});
于 2012-05-14T14:50:47.117 回答
3

这听起来像是利用 jQuery 的 Deferred 对象的理想场所。

Addy Osmani 和 Julian Aubourg 在 MSDN 上有一篇很棒的文章：http: //msdn.microsoft.com/en-us/magazine/gg723713.aspx

简而言之，他们有一个例子来解释他们如何缓存请求，特别是这个请求将被永久缓存。

var cachedPromises = {};

$.getCachedURL = function( url, callback ) {
    if ( !cachedPromises[ url ] ) {
        cachedPromises[ url ] = $.Deferred(function( defer ) {
            $.get( url ).then( defer.resolve, defer.reject );
        }).promise();
    }
    return cachedPromises[ url ].done( callback );
};

然后像这样解决 Deferred

$.getCachedURL( url ).then( successCallback, errorCallback );

因此，如果您希望仅将某些 url 缓存一段时间，我们可以修改现有代码并按照以下方式执行某些操作（请注意，这不是我的想法）

var cachedPromises = {};
var cachedTimeouts = {};

$.getCachedURL = function( url, callback, cacheTime) {
    if ( !cachedPromises[ url ] ) {
        cachedPromises[ url ] = $.Deferred(function( defer ) {
            $.get( url ).then( defer.resolve, defer.reject );
        }).promise();
        cachedTimeouts[ url ] = setTimeout(function () {
            clearTimeout(cachedTimeouts[ url ]);
            delete cachedPromises[ url ];
        }, cacheTime);
    }
    return cachedPromises[ url ].done( callback );
};

并使用回调：

var callback = function () {
    console.log('callback', arguments)
}

var cacheTime = 3600;

$.getCachedURL('/dynamic/config', callback, cacheTime).then(function ()
{
    console.log('success', arguments)
}, function ()
{
    console.log('error', arguments)
});

其中回调将返回传统的 jQuery ajax 成功/错误参数data，textStatus并且jqXHR

如果你想使用 JSON$.getJSON而不是$.get

$.get( url ).then( defer.resolve, defer.reject );
$.getJSON( url ).then( defer.resolve, defer.reject );

请注意，您仍然可以使用$.ajax 

$.ajax({
    url: url,
    dataType: 'json',
}).then( defer.resolve, defer.reject );
于 2012-05-14T15:06:39.253 回答