8

jquery で渡すtrueとcache、$.ajax()ロードされたデータがキャッシュされます。キャッシュ時間を変更する方法はあります$.ajax()か? たとえば、ajax が 10 分で要求された場合、jquery は以前のデータをロードしますが、10 分後に要求された場合は新しいデータをロードします。

アップデート ：

JSON データをキャッシュする必要があるため、JSON データ型で Ajax を使用する必要があります

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編集: これをより完全なソリューションにするために、実際の Ajax 呼び出しに対して透過的にすべての jQuery 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。textStatusjqXHR

$.getJSON代わりにJSON を使用する場合$.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 に答える