在执行任何绑定回调之前修改ajax响应

时间:2012-10-10 16:06:12

标签: javascript jquery

问题

在触发所有绑定回调之前,我需要一种方法来修改应用中的所有ajax响应。

标准的ajax事件,无论是全局还是本地,都没有提供在触发应用程序绑定回调之前修改响应的好方法。

触发ajax事件的顺序是jquery's ajax event docs中指示的顺序。

  • ajaxStart(全球活动)
  • beforeSend(本地活动)
  • ajaxSend(全球活动)
  • 成功(本地活动)
  • ajaxSuccess(全球事件)
  • 错误(本地事件)
  • ajaxError(全球事件)
  • 完成(本地活动)
  • ajaxComplete(全球事件)
  • ajaxStop(全球事件)

请注意,在响应从服务器返回之后但在运行成功/ erorr回调之前没有执行钩子,例如ajaxReturn ajaxSend之后success|error

之前ajaxStart

我攻击的方式是使用在options之前执行的$.ajaxPrefilter并将已绑定的成功/错误回调包装在另一个函数中,这将允许我修改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); } }); 对象以及返回的数据。

下面是执行包装的实用程序函数和示例:

{{1}}

我必须提到我将其用于测试目的,所以我不关心性能,内存和开销。

2 个答案:

答案 0 :(得分:7)

如果您想在服务器到达事件处理程序之前修改从服务器返回的数据,请使用dataFilter:

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

            return data;
        }
    });

答案 1 :(得分: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
});

});