0%

JS 快速定位

常用的定位方法与hook脚本

快速定位之搜索

  • 中间人的全局搜索(fiddle有个放大镜 搜索 可以搜索 到目标字符串 )
  • 开发者工具的全局搜索(dom搜索和全局搜索,可以搜索html和js)

快速定位之断点

  • 自定义特定的断点 寻找到关键位置打上断点
  • dom断点 页面元素绑定了事件
  • xhr断点,比如登录,搜索框
  • event断点 比如鼠标点击

快速定位之hook

  • json
  • cookie
  • window attr
  • eval/Function
  • websocket
  • and so on

json hook

1
2
3
4
5
6
7
8
9
10
11
12
13
var my_stringify = JSON.stringify;
JSON.stringify = function (params) {
//这里可以添加其他逻辑比如 debugger
console.log("json_stringify params:",params);
return my_stringify(params);
};

var my_parse = JSON.parse;
JSON.parse = function (params) {
//这里可以添加其他逻辑比如 debugger
console.log("json_parse params:",params);
return my_parse(params);
};

cookies hook

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
var cookie_cache = document.cookie;

Object.defineProperty(document, 'cookie', {
get: function() {
console.log('Getting cookie');
return cookie_cache;
},
set: function(val) {
console.log("Seting cookie",val);
var cookie = val.split(";")[0];
var ncookie = cookie.split("=");
var flag = false;
var cache = cookie_cache.split("; ");
cache = cache.map(function(a){
if (a.split("=")[0] === ncookie[0]){
flag = true;
return cookie;
}
return a;
})
}
})

window attr

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
// 定义hook属性
var window_flag_1 = "_t";
var window_flag_2 = "ccc";

var key_value_map = {};
var window_value = window[window_flag_1];

// hook
Object.defineProperty(window, window_flag_1, {
get: function(){
console.log("Getting",window,window_flag_1,"=",window_value);
//debugger
return window_value
},
set: function(val) {
console.log("Setting",window, window_flag_1, "=",val);
//debugger
window_value = val;
key_value_map[window[window_flag_1]] = window_flag_1;
set_obj_attr(window[window_flag_1],window_flag_2);
},

});

function set_obj_attr(obj,attr){
var obj_attr_value = obj[attr];
Object.defineProperty(obj,attr, {
get: function() {
console.log("Getting", key_value_map[obj],attr, "=", obj_attr_value);
//debugger
return obj_attr_value;
},
set: function(val){
console.log("Setting", key_value_map[obj], attr, "=", val);
//debugger
obj_attr_value = val;
},
});
}

eval/Function

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
window.__cr_eval = window.eval;
var myeval = function(src) {
console.log(src);
console.log("========= eval end ===========");
return window.__cr_eval;
}

var _myeval = myeval.bind(null);
_myeval.toString = window.__cr_eval.toString;
Object.defineProperty(window, 'eval',{value: _myeval});

window._cr_fun = window.Function
var myfun = function(){
var args = Array.prototype.slice.call(arguments, 0, -1).join(","), src = arguments[arguments.lenght -1];
console.log(src);
console.log("======== Function end =============");
return window._cr_fun.apply(this, arguments)
}

myfun.toString = function() {return window._cr_fun + ""} //小花招,这里防止代码里检测原生函数
Object.defineProperty(window, "Function",{value: myfun})

websocket hook

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 // 1、webcoket 一般都是json数据格式传输,那么发生之前需要JSON.stringify  
var my_stringify = JSON.stringify;
JSON.stringify = function (params) {
//这里可以添加其他逻辑比如 debugger
console.log("json_stringify params:",params);
return my_stringify(params);
};

var my_parse = JSON.parse;
JSON.parse = function (params) {
//这里可以添加其他逻辑比如 debugger
console.log("json_parse params:",params);
return my_parse(params);
};

// 2 webScoket 绑定在windows对象,上,根据浏览器的不同,websokcet名字可能不一样
//chrome window.WebSocket firfox window.MozWebSocket;
window._WebSocket = window.WebSocket;

// hook send
window._WebSocket.prototype.send = function (data) {
console.info("Hook WebSocket", data);
return this.send(data)
}

Object.defineProperty(window, "WebSocket",{value: WebSocket})

快速定位之分析

  1. Element Event Listeners 查看dom元素绑定的事件
  2. Network type initator 查看请求发送事执行的调用栈
  3. Console Log XMLHttpRequest 勾选更多的监控日志

快速定位之注入

  1. 谷歌浏览器 安装油猴插件 编写脚本
  2. 中间人代理
  3. 浏览器开发者工具打上scrapt断点,在console写入注入脚本

注意注入时机
https://www.tampermonkey.net/documentation.php?ext=dhdg#_run_at