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 回答