（點(diǎn)擊上方公眾號(hào)，可快速關(guān)注）

英文： x-c3ll? ?譯文：FreeBuf.COM

www.freebuf.com/articles/system/163579.html

寫在前面的話

在此之前，我一直都在研究JavaScript相關(guān)的反調(diào)試技巧。但是當(dāng)我在網(wǎng)上搜索相關(guān)資料時(shí)，我發(fā)現(xiàn)網(wǎng)上并沒有多少關(guān)于這方面的文章，而且就算有也是非常不完整的那種。所以在這篇文章中，我打算跟大家總結(jié)一下關(guān)于JavaScript反調(diào)試技巧方面的內(nèi)容。值得一提的是，其中有些方法已經(jīng)被網(wǎng)絡(luò)犯罪分子廣泛應(yīng)用到惡意軟件之中了。

對于JavaScript來說，你只需要花一點(diǎn)時(shí)間進(jìn)行調(diào)試和分析，你就能夠了解到JavaScript代碼段的功能邏輯。而我們所要討論的內(nèi)容，可以給那些想要分析你JavaScript代碼的人增加一定的難度。不過我們的技術(shù)跟代碼混淆無關(guān)，我們主要針對的是如何給代碼主動(dòng)調(diào)試增加困難。

本文所要介紹的技術(shù)方法大致如下：

1. 檢測未知的執(zhí)行環(huán)境（我們的代碼只想在瀏覽器中被執(zhí)行）；

2. 檢測調(diào)試工具（例如DevTools）；

3. 代碼完整性控制；

4. 流完整性控制；

5. 反模擬；

簡而言之，如果我們檢測到了“不正常”的情況，程序的運(yùn)行流程將會(huì)改變，并跳轉(zhuǎn)到偽造的代碼塊，并“隱藏”真正的功能代碼。

一、函數(shù)重定義

這是一種最基本也是最常用的代碼反調(diào)試技術(shù)了。在JavaScript中，我們可以對用于收集信息的函數(shù)進(jìn)行重定義。比如說，console.log()函數(shù)可以用來收集函數(shù)和變量等信息，并將其顯示在控制臺(tái)中。如果我們重新定義了這個(gè)函數(shù)，我們就可以修改它的行為，并隱藏特定信息或顯示偽造的信息。

我們可以直接在DevTools中運(yùn)行這個(gè)函數(shù)來了解其功能：

console.log("HelloWorld");

var?fake?=?function()?{};

window['console']['log']=?fake;

console.log("Youcan't see me!");

運(yùn)行后我們將會(huì)看到：

VM48:1 Hello World

你會(huì)發(fā)現(xiàn)第二條信息并沒有顯示，因?yàn)槲覀冎匦露x了這個(gè)函數(shù)，即“禁用”了它原本的功能。但是我們也可以讓它顯示偽造的信息。比如說這樣：

console.log("Normalfunction");

//First we save a reference to the original console.log function

var?original?=?window['console']['log'];

//Next we create our fake function

//Basicly we check the argument and if match we call original function with otherparam.

// If there is no match pass the argument to the original function

var?fake?=?function(argument)?{

????if?(argument?===?"Ka0labs")?{

????????original("Spoofed!");

????}?else?{

????????original(argument);

????}

}

// We redefine now console.log as our fake function

window['console']['log']=?fake;

//Then we call console.log with any argument

console.log("Thisis unaltered");

//Now we should see other text in console different to "Ka0labs"

console.log("Ka0labs");

//Aaaand everything still OK

console.log("Byebye!");

如果一切正常的話：

Normal?function

VM117:11?This?is?unaltered

VM117:9?Spoofed!

VM117:11?Bye?bye!

實(shí)際上，為了控制代碼的執(zhí)行方式，我們還能夠以更加聰明的方式來修改函數(shù)的功能。比如說，我們可以基于上述代碼來構(gòu)建一個(gè)代碼段，并重定義eval函數(shù)。我們可以把JavaScript代碼傳遞給eval函數(shù)，接下來代碼將會(huì)被計(jì)算并執(zhí)行。如果我們重定義了這個(gè)函數(shù)，我們就可以運(yùn)行不同的代碼了：

//Just a normal eval

eval("console.log('1337')");

//Now we repat the process...

var?original?=?eval;

var?fake?=?function(argument)?{

????// If the code to be evaluated contains1337...

????if?(argument.indexOf("1337")?!==-1)?{

????????// ... we just execute a different code

????????original("for (i = 0; i < 10;i++) { console.log(i);}");

????}?

????else?{

????????original(argument);

????}

}

?

eval=?fake;

eval("console.log('Weshould see this...')");

//Now we should see the execution of a for loop instead of what is expected

eval("console.log('Too1337 for you!')");

運(yùn)行結(jié)果如下：

1337

VM146:1We?should see?this…

VM147:10

VM147:11

VM147:12

VM147:13

VM147:14

VM147:15

VM147:16

VM147:17

VM147:18

VM147:19

正如之前所說的那樣，雖然這種方法非常巧妙，但這也是一種非?；A(chǔ)和常見的方法，所以比較容易被檢測到。

二、斷點(diǎn)

為了幫助我們了解代碼的功能，JavaScript調(diào)試工具（例如DevTools）都可以通過設(shè)置斷點(diǎn)的方式阻止腳本代碼執(zhí)行，而斷點(diǎn)也是代碼調(diào)試中最基本的了。

如果你研究過調(diào)試器或者x86架構(gòu)，你可能會(huì)比較熟悉0xCC指令。在JavaScript中，我們有一個(gè)名叫debugger的類似指令。當(dāng)我們在代碼中聲明了debugger函數(shù)后，腳本代碼將會(huì)在debugger指令這里停止運(yùn)行。比如說：

console.log("Seeme!");

debugger;

console.log("Seeme!");

很多商業(yè)產(chǎn)品會(huì)在代碼中定義一個(gè)無限循環(huán)的debugger指令，不過某些瀏覽器會(huì)屏蔽這種代碼，而有些則不會(huì)。這種方法的主要目的就是讓那些想要調(diào)試你代碼的人感到厭煩，因?yàn)闊o限循環(huán)意味著代碼會(huì)不斷地彈出窗口來詢問你是否要繼續(xù)運(yùn)行腳本代碼：

setTimeout(function(){while?(true)?{eval("debugger")

三、時(shí)間差異

這是一種從傳統(tǒng)反逆向技術(shù)那里借鑒過來的基于時(shí)間的反調(diào)試技巧。當(dāng)腳本在DevTools等工具環(huán)境下執(zhí)行時(shí)，運(yùn)行速度會(huì)非常慢（時(shí)間久），所以我們就可以根據(jù)運(yùn)行時(shí)間來判斷腳本當(dāng)前是否正在被調(diào)試。比如說，我們可以通過測量代碼中兩個(gè)設(shè)置點(diǎn)之間的運(yùn)行時(shí)間，然后用這個(gè)值作為參考，如果運(yùn)行時(shí)間超過這個(gè)值，說明腳本當(dāng)前在調(diào)試器中運(yùn)行。

演示代碼如下：

set Interval(function(){

??var?startTime?=?performance.now(),?check,diff;

??for?(check?=?0;?check?<?1000;?check++){

????console.log(check);

????console.clear();

??}

??diff?=?performance.now()?-?startTime;

??if?(diff?>?200){

????alert("Debugger detected!");

??}

},500);

四、DevTools檢測（Chrome）

這項(xiàng)技術(shù)利用的是div元素中的id屬性，當(dāng)div元素被發(fā)送至控制臺(tái)（例如console.log(div)）時(shí)，瀏覽器會(huì)自動(dòng)嘗試獲取其中的元素id。如果代碼在調(diào)用了console.log之后又調(diào)用了getter方法，說明控制臺(tái)當(dāng)前正在運(yùn)行。

簡單的概念驗(yàn)證代碼如下：

let?div?=?document.createElement('div');

let?loop?=?setInterval(()?=>?{

????console.log(div);

????console.clear();

});

Object.defineProperty(div,"id",?{get:?()?=>?{

????clearInterval(loop);

????alert("Dev Tools detected!");

}});

五、隱式流完整性控制

當(dāng)我們嘗試對代碼進(jìn)行反混淆處理時(shí)，我們首先會(huì)嘗試重命名某些函數(shù)或變量，但是在JavaScript中我們可以檢測函數(shù)名是否被修改過，或者說我們可以直接通過堆棧跟蹤來獲取其原始名稱或調(diào)用順序。

arguments.callee.caller可以幫助我們創(chuàng)建一個(gè)堆棧跟蹤來存儲(chǔ)之前執(zhí)行過的函數(shù)，演示代碼如下：

function?getCallStack()?{

????var?stack?=?"#",?total?=?0,?fn?=arguments.callee;

????while?(?(fn?=?fn.caller)?)?{

????????stack?=?stack?+?""?+fn.name;

????????total++

????}

????return?stack

}

function?test1()?{

????console.log(getCallStack());

}

function?test2()?{

????test1();

}

function?test3()?{

????test2();

}

function?test4()?{

????test3();

}

test4();

注意：源代碼的混淆程度越強(qiáng)，這個(gè)技術(shù)的效果就越好。

六、代理對象

代理對象是目前JavaScript中最有用的一個(gè)工具，這種對象可以幫助我們了解代碼中的其他對象，包括修改其行為以及觸發(fā)特定環(huán)境下的對象活動(dòng)。比如說，我們可以創(chuàng)建一個(gè)嗲哩對象并跟蹤每一次document.createElemen調(diào)用，然后記錄下相關(guān)信息：

const?handler?=?{?// Our hook to keep the track

????apply:?function?(target,?thisArg,?args){

????????console.log("Intercepted a call tocreateElement with args: "?+?args);

????????return?target.apply(thisArg,?args)

????}

}

document.createElement=?new?Proxy(document.createElement,?handler)?// Create our proxy object withour hook ready to intercept

document.createElement('div');

接下來，我們可以在控制臺(tái)中記錄下相關(guān)參數(shù)和信息：

VM64:3?Intercepted?a?call?to?createElement with?args:?div

我們可以利用這些信息并通過攔截某些特定函數(shù)來調(diào)試代碼，但是本文的主要目的是為了介紹反調(diào)試技術(shù)，那么我們?nèi)绾螜z測“對方”是否使用了代理對象呢？其實(shí)這就是一場“貓抓老鼠”的游戲，比如說，我們可以使用相同的代碼段，然后嘗試調(diào)用toString方法并捕獲異常：

//Call a "virgin" createElement:

try?{

????document.createElement.toString();

}catch(e){

????console.log("I saw your proxy!");

}

信息如下：

"function createElement() { [native code] }"

但是當(dāng)我們使用了代理之后：

//Then apply the hook

consthandler?=?{

????apply:?function?(target,?thisArg,?args){

????????console.log("Intercepted a call tocreateElement with args: "?+?args);

????????return?target.apply(thisArg,?args)

????}

}

document.createElement=?new?Proxy(document.createElement,?handler);

//Callour not-so-virgin-after-that-party createElement

try?{

????document.createElement.toString();

}catch(e)?{

????console.log("I saw your proxy!");

}

沒錯(cuò)，我們確實(shí)可以檢測到代理：

VM391:13 I saw your proxy!

我們還可以添加toString方法：

const?handler?=?{

????apply:?function?(target,?thisArg,?args){

????????console.log("Intercepted a call tocreateElement with args: "?+?args);

????????return?target.apply(thisArg,?args)

????}

}

document.createElement=?new?Proxy(document.createElement,?handler);

document.createElement=?Function.prototype.toString.bind(document.createElement);?//Add toString

//Callour not-so-virgin-after-that-party createElement

try?{

????document.createElement.toString();

}catch(e)?{

????console.log("I saw your proxy!");

}

現(xiàn)在我們就沒辦法檢測到了：

"function createElement() { [native code] }"

就像我說的，這就是一場“貓抓老鼠“的游戲。

總結(jié)

希望我所收集到的這些技巧可以對大家有所幫助，如果你有更好的技巧想跟大家分享，可以直接在文章下方的評(píng)論區(qū)留言，或者在Twitter上艾特我（@TheXC3LL）。

【關(guān)于投稿】

如果大家有原創(chuàng)好文投稿，請直接給公號(hào)發(fā)送留言。

①?留言格式：
【投稿】+《?文章標(biāo)題》+?文章鏈接

②?示例：
【投稿】《不要自稱是程序員，我十多年的?IT?職場總結(jié)》：http://blog.jobbole.com/94148/

③?最后請附上您的個(gè)人簡介哈~

覺得本文對你有幫助？請分享給更多人

關(guān)注「前端大全」，提升前端技能

總結(jié)

以上是生活随笔為你收集整理的JavaScript 反调试技巧的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。