一个实际运营中的产品,突然遇到了这样的展示需求:
在前端拦截所有的AJAX请求,将其中的XXX电力局字样全部改为XXX水利局字样。
首先想到的是利用jQuery的全局AJAX方法,但检索了一遍 .ajaxComplete、 .ajaxSuccess等全局方法,发现所有的全局方法都只能对AJAX数据进行只读操作。难道真的没有办法了吗?
重新复写$.ajax方法是否可行?应该可以达到目的,但代码量可能会比较大,后续的jQuery版本更新也是一件麻烦的事情。
那对$.ajax的success配置创建代理是否可行?这样代价最小,测试代码如下:
var ajax = $.ajax;
// 修改ajax方法的默认实现
$.ajax = function(options) {
var success = options.success;
// 对用户配置的success方法进行代理
function ns(datas) {
var args = arguments;
// 对数据进行处理
var str = JSON.stringify(datas);
var rstr = str.replace(/XXX电力局/g, 'XXX水利局');
// 替换回调函数的数据参数
args[0] = JSON.parse(rstr);
// 这里需要判断用户传入的上下文,具体实现略
return success.apply(this, args);
}
// 代理嵌入调用
options.success = ns;
return ajax(options);
}
// jQuery的所有ajax方法都基于$.ajax方法
$.getJSON('abc.json', function(data) {
// 测试数据是否已变更
alert(data.name);
})
经过测试,完全能够达到演示效果,区区几行代码,就替代了后端繁琐的数据更新工作。