4

問題

バインドされたすべてのコールバックがトリガーされる前に、アプリ内のすべての ajax 応答を変更する方法が必要でした。

解決

標準の ajax イベントは、グローバルとローカルの両方で、アプリ バウンド コールバックがトリガーされる前に応答を変更する適切な方法を提供しません。

ajax イベントがトリガーされる順序は、jquery の ajax イベント ドキュメントに示されている順序です。

  • ajaxStart (グローバルイベント)
  • beforeSend (ローカル イベント)
  • ajaxSend (グローバルイベント)
  • 成功 (ローカル イベント)
  • ajaxSuccess (グローバルイベント)
  • エラー (ローカル イベント)
  • ajaxError (グローバル イベント)
  • 完了 (ローカル イベント)
  • ajaxComplete (グローバル イベント)
  • ajaxStop (グローバルイベント)

ajaxReturn応答がサーバーから返された後、成功/エラー コールバックが実行されるajaxSend前に実行されるフックがないことに注意してください。success|error

これをハッキングした方法は、以前に実行された$.ajaxPrefilterajaxStartを使用し、既にバインドされている成功/エラー コールバックを別の関数にラップして、optionsオブジェクトを変更し、返されたデータを変更できるようにすることでした。

以下は、ラッピングを行うユーティリティ関数と例です。

var alterResponse = function (opts) {
    var callback = function (options, originalOptions, jqXHR) {
        if (options.url.match(opts.urlMatch)) {
            // Cache original callback.
            var originalSuccess = originalOptions.success || options.success;
            originalOptions.success = options.success = function () {
                // Call wrapper that will modify the response object.
                opts.successWrapper.call(null, options, originalOptions, jqXHR, originalSuccess);
            };
        }
    };
    if (opts.dataTypes) {
        $.ajaxPrefilter(opts.dataTypes, callback)
    }
    else {
        $.ajaxPrefilter(callback);
    }
};

alterResponse({
    urlMatch: /myurl/g, // Filter urls you what to tamper with.
    successWrapper: function (options, originalOptions, jqXHR, originalFn) {
        options.data.customVar = 'customValue';
        originalFn(options, originalOptions, jqXHR);
    }
});

これはテスト目的で使用しているため、パフォーマンス、メモリ、オーバーヘッドについては心配していません。

4

2 に答える 2

9

イベントハンドラーに到達する前にサーバーから返されるデータを変更する場合は、dataFilterを使用します。

    jquery.ajaxSetup({
        dataFilter: function (data, type) {
            //modify your data here

            return data;
        }
    });
于 2013-01-04T21:12:51.637 に答える
0

任意のグローバル ajax イベントを使用できます

$(document).ajaxSuccess(function() {
   alert("An individual AJAX call has completed successfully");
 });
 //or...
$(document).ajaxComplete(function() {
  alert("ALL current AJAX calls have completed");
});

//or.. 
$(function() {
$.ajaxSetup({
    complete: function(xhr, textStatus) {
        // will be raised whenever an AJAX request completes (success or failure)
    },
    success: function(result) {
        // will be raised whenever an AJAX request succeeds
    },
    etc ... you could use any available option
});

});

于 2012-10-10T16:11:06.390 に答える