0.题目
抓取所有(5页)机票的价格,并计算所有机票价格的平均值,填入答案。
1.无限debugger
打开开发者工具后,首先面对的是一个无限debugger,解决的方法:可以使用Ctril+F8禁用断点(但这样不便于自己打断点调试),也可以为无限debugger语句添加一个条件语句,使其不执行(这里我写的是0)。
2.定位代码
在控制台Network面板中,找到机票价格列表的相关请求,然后在请求堆栈中点击request,定位到发请求的代码所在。
3.Unicode解码
因为上一步找到的代码是做了混淆和Unicode编码的,这里我们可以使用在线解密工具对代码进行解密,也可以手动解码:
1)将相关代码放入“``”中,并在控制台中输出,即可得到Unicode解码后的代码字符串;
2)但此时代码中包含\n\r之类的字符,需要再整理一下。这里我通过textarea标签进行整理;
// 通过textarea整理代码字符串
let ele = document.createElement('textarea');
document.body.appendChild(ele);
ele.value = `Unicode解码后的代码字符串`;
ele.select();
document.execCommand('Copy');
// 得到的解码后的代码
window['url'] = '/api/' + 'match' + '/1', request = function () {
var _0x2268f9 = Date['parse'](new Date()) + (16798545 + -72936737 + 156138192), _0x57feae = oo0O0(_0x2268f9['toStr' + 'ing']()) + window['f'];
const _0x5d83a3 = {};
_0x5d83a3['page'] = window['page'], _0x5d83a3['m'] = _0x57feae + '丨' + _0x2268f9 / (-1 * 3483 + -9059 + 13542);
var _0xb89747 = _0x5d83a3;
$['ajax']({
'url': window['url'],
'dataType': 'json',
'async': ![],
'data': _0xb89747,
'type': 'GET',
'beforeSend': function (_0x4c488e) {
},
'success': function (_0x131e59) {
// 省略部分代码
},
'complete': function () {
},
'error': function () {
// 省略部分代码
}
});
};
4.修改代码
在得到的代码中,分析可知:机票列表的请求被定义为一个名为request的函数,该函数有两个传参“page”和“m”,page是页码,使用的是全局变量page,而m是通过函数oo0O0经过一番计算得来的。
这里,我的思路是直接在控制台来重新修改request函数(主要是修改回调函数逻辑),在请求成功后将列表存储下来,当5个页面都请求完成后计算出机票价格的平均值。
下面是修改后的代码,修改后在控制台执行它们:
window.page = 1; // 重置全局页码变量
window.arr = []; // 用来存储各个页面的数据
window.sum = 0; // 用来存储各个页面的数据之和
request = function () { // 修改函数定义(主要是修改回调函数中的代码逻辑)
var _0x2268f9 = Date['parse'](new Date()) + (16798545 + -72936737 + 156138192), _0x57feae = oo0O0(_0x2268f9['toStr' + 'ing']()) + window['f'];
const _0x5d83a3 = {};
_0x5d83a3['page'] = window['page'], _0x5d83a3['m'] = _0x57feae + '丨' + _0x2268f9 / (-1 * 3483 + -9059 + 13542);
var _0xb89747 = _0x5d83a3;
return $['ajax']({
'url': window['url'],
'dataType': 'json',
'async': ![],
'data': _0xb89747,
'type': 'GET',
'beforeSend': function (_0x4c488e) {
},
'success': function (res) {
window.arr = window.arr || []
window.arr = [...window.arr, ...res.data]
if (window.page < 5) { // 通过递归依次请求各个页面的数据
window.page++;
request();
} else {
window.sum = window.arr.reduce((a,b) => {
return a + (b.value || 0)
}, 0)
console.log('result:', window.sum / window.arr.length)
}
}
});
};
5.修改请求头
完成上述修改后,还有一个问题,就是第四页第五页的内容在请求时需要有个请求头“user-agent:yuanrenxue.project”,这里我使用 Modheader 这个浏览器插件来实现。
6.获取结果
最后,在控制台执行 request() 即可。request函数通过递归得到所有的机票价格列表,然后计算并打印出最后的平均数。