对于有些网站,想要执行某些操作通过js来执行会比较方便些,但是有些操作涉及事件触发请求,而这些请求的回调操作是渲染页面,此时我们肯定是不想自己来执行渲染操作,可事件的触发又比较麻烦,所以我们此时就需要采取一些非常规手段了,下面开始直接说方法:
所有框架的请求最终都要通过原生的js来执行,所以我们就直接修改原生的js请求,对其添加过滤然后我们就可以偷梁换柱来达到想要的效果了,下面上代码:
(function(st, et){
window.st = st; // 此处以修改某个get请求参数中的日期为例
window.et = et;
var gwXHR = window.XMLHttpRequest;
var gwXHRProto = window.XMLHttpRequest.prototype;
var gwXHRProtoSend = window.XMLHttpRequest.prototype.send;
var gwXHRProtoOpen = window.XMLHttpRequest.prototype.open;
if(!window.initOnce) {
window.initOnce = true;
Object.defineProperty(window, 'XMLHttpRequest', {
enumerable: true,
configurable: true,
get: function(){ // 重定义get请求
return function(){
var gwXHRIns = null;
console.log('get XMLHttpRequest');
gwXHRIns = new gwXHR();
var islist=false;
gwXHRIns.open = function(){
var requrl = arguments[1];
// console.log('==============requrl:', requrl);
if(/xxxxxxxx\/recallReport\/list/i.test(requrl)) { // 使用正则过滤每个请求,对匹配到的请求执行如下修改
requrl = requrl.replace(/^(.*)(startDate=)([^\&]*)(\&endDate=)([^\&]*)(.*)$/i, function(m, m1, m2, m3, m4, m5, m6){
return m1+m2+(window.st.replace(/\//ig,''))+m4+(window.et.replace(/\//ig,''))+m6; // 修改为自定义的日期
});
//requrl = requrl.replace(/^(.*)(startDate=)([^\&]*)(\&endDate=)([^\&]*)(&platForm=)([^\&]*)(&codeIds=)([^\&]*)(.*)$/i, function(a, a1, a2, a3, a4, a5, a6, a7, a8, a9, a0){
// return a1 + a2+ (window.st.replace(/\//ig,'')) + a4 + (window.et.replace(/\//ig,'')) + a6 +'platform' + a8 + 'codeIds' + a0
//});
arguments[1] = requrl;
console.log(arguments);
}
gwXHRProtoOpen.apply(this, arguments);
};
return gwXHRIns;
};
}
});
}
setTimeout(function(){
// 手动触发onchange事件
document.querySelector('.el-button--primary').click();
}, 300);
})('2019/03/01', '2019/03/31');
此处较容易才坑的点,由于替换原生请求,所以一般只能执行一次,再次执行的时候需要刷新页面才行。