一、概述
javascript函数劫持,也就是老外提到的javascript hijacking技术。最早还是和剑心同学讨论问题时偶然看到的一段代码,大概这样写的:
window.alert = function(s) {};
觉得这种用法很巧妙新颖,和API Hook异曲同工,索性称之为javascript function hook,也就是函数劫持。通过替换js函数的实现来达到劫持这个函数调用的目的,一个完整的hook alert函数例子如下:
<!–1.htm–>
<script type=”text/javascript”>
<!–
var _alert = alert;
window.alert = function(s) {
if (confirm(”是否要弹框框,内容是\”" + s + “\”?”)) {
_alert(s);
}
}
//–>
</script>
<html>
<body>
<input type=”button” onclick=”javascript: alert(’Hello World!’)” value=”test” />
</body>
</html>
搞过API Hook的同学们看到这个代码一定会心的一笑,先保存原函数实现,然后替换为我们自己的函数实现,添加我们自己的处理逻辑后最终再调用原来的函数实现,这样这个alert函数就被我们劫持了。原理非常简单,下面举些典型的应用来看看我们能利用它来做些什么。
二、应用举例
1. 实现一个简易的javascript debugger,这里说是debugger比较标题党,其实只是有点类似于debugger的功能,主要利用js函数劫持来实现函数的break point,来看看个简单的例子:
<script type=”text/javascript”>
<!–
var _eval = eval;
eval = function(s) {
if (confirm(”eval被调用\n\n调用函数\n” + eval.caller + “\n\n调用参数\n” + s)) {
_eval(s);
}
}
//–>
</script>
<html>
<head>
</head>
<body>
<script type=”text/javascript”>
<!–
function test() {
var a = “alert(1)”;
eval(a);
}
function t() {
test();
}
t();
//–>
</script>
</body>
</html>
通过js函数劫持中断函数执行,并显示参数和函数调用者代码,来看一个完整例子的效果:
>help
debug commands:
bp <function name> - set a breakpoint on a function, e.g. “bp window.alert”.
bl - list all breakpoints.
bc <breakpoint number> - remove a breakpoint by specified number, e.g. “bc 0″.
help - help information.
>bp window.alert
* breakpoint on function “window.alert” added successfully.
>bl
* 1 breakpoints:
0 - window.alert
>bc 0
* breakpoint on function “window.alert” deleted successfully.
这里演示设置断点,察看断点和删除断点,完整代码在本文附录[1]给出。
2. 设置陷阱实时捕捉跨站测试者,搞跨站的人总习惯用alert来确认是否存在跨站,如果你要监控是否有人在测试你的网站xss的话,可以在你要监控的页面里hook alert函数,记录alert调用情况:
<script type=”text/javascript”>
<!–
function log(s) {
var img = new Image();
img.style.width = img.style.height = 0;
img.src = “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head><title>Javascript Inline Debugger</title></head>
<body>
<script language=”javascript” type=”text/javascript” src=”js_inline_debugger.js”></script>
<input type=”button” value=”hahaha” onclick=”javascript: alert(this.value);” style=”margin-left: 300px;” />
</body>
</html>
/*
FileName: js_inline_debugger.js
Author: luoluo
Contact: luoluonet_at_yahoo.cn
Date: 2007-6-27
Version: 0.1
Usage:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
</head>
<body>
<script language=”javascript” type=”text/javascript” src=”js_inline_debugger.js”></script>
</body>
</html>
Instruction:
It is a simple javascript inline debugger. You must add xhtml1-transitional dtd to your
html document if you wanna to use the script.
*/
//————————————————————————–//
// 公用的函数
//————————————————————————–//
// 判断是否是IE
function isIE() {
return document.all && window.external;
}
// 去除字符串两边的空格
String.prototype.trim = function() {
var re = /(^\s*)|(\s*)$/g;
return this.replace(re, “”);
}
// 删除数组中某个元素
Array.prototype.remove = function(i) {
var o = this[i];
for (var j = i; j < this.length - 1; j ++) {
this[j] = this[j + 1];
}
– this.length;
return o;
}
// 判断一个数组中是否存在相同的元素
Array.prototype.search = function(o) {
for (var i = 0; i < this.length; i ++) {
if (this[i] == o) {
return i;
}
}
return -1;
}
// html编码
function htmlEncode(s) {
s = s.replace(/&/g, “&”);
s = s.replace(/</g, “<”);
s = s.replace(/>/g, “>”);
s = s.replace(/\”/g, “"”);
s = s.replace(/\’/g, “"”);
return s;
}
// js编码
function jsEncode(s) {
s = s.replace(/\\/g, “\\\\”);
s = s.replace(/\n/g, “\\n”);
s = s.replace(/\”/g, “\\\”");
s = s.replace(/\’/g, “\\\’”);
return s;
}
//————————————————————–//
// 命令行窗口工具
//————————————————————–//
function Console(parentNode, processInputProc) {
// 窗口
var panel = document.createElement(”div”);
panel.style.width = “250px”;
panel.style.height = “250px”;
panel.style.borderColor = “#666666″;
panel.style.borderWidth = “1px”;
panel.style.backgroundColor = “#ffffff”;
panel.style.borderStyle = “solid”;
panel.style.position = “absolute”;
panel.style.zIndex = 100;
parentNode.appendChild(panel);
// 标题栏
var title = document.createElement(”div”);
title.style.width = “250px”;
title.style.height = “15px”;
title.style.backgroundColor = “#dddddd”;
title.style.fontSize = “12px”;
title.style.fontFamily = “verdana,tahoma”;
panel.appendChild(title);
// 标题栏拖动窗口功能
var isDragging = false;
var startPos = new Position(panel.offsetLeft, panel.offsetTop);
var startMousePos = new Position(0, 0);
title.onmouseover = function(evt) {
this.style.cursor = “pointer”;
}
title.onmousedown = function(evt) {
if (isDragging == true) {
return;
}
var event = evt || window.event;
startMousePos.x = event.clientX;
startMousePos.y = event.clientY;
isDragging = true;
}
title.onmousemove = function(evt) {
if (isDragging == false) {
return;
}
activateWindow();
var event = evt || window.event;
panel.style.left = (event.clientX - startMousePos.x) + startPos.x + “px”;
panel.style.top = (event.clientY - startMousePos.y) + startPos.y + “px”;
}
title.onmouseup = function(evt) {
if (isDragging == false) {
return;
}
var event = evt || window.event;
startPos.x = (event.clientX - startMousePos.x) + startPos.x;
panel.style.left = startPos.x + “px”;
startPos.y = (event.clientY - startMousePos.y) + startPos.y;
panel.style.top = startPos.y + “px”;
isDragging = false;
}
// 关闭窗口功能
var closeButton = document.createElement(”div”);
closeButton.style.width = “13px”;
closeButton.style.height = “13px”;
closeButton.style.backgroundColor = “#ffffff”;
closeButton.style.styleFloat = closeButton.style.cssFloat = “left”;
closeButton.style.fontSize = “12px”;
closeButton.style.borderWidth = “1px”;
closeButton.style.borderColor = “#999999″;
closeButton.style.borderStyle = “solid”;
closeButton.style.paddingButton = “2px”;
closeButton.innerHTML = “<div style=\”margin-top: -2px;margin-left: 3px;\”>x</div>”;