javascript
JavaScript 反调试技巧
（點擊上方公眾號，可快速關注）
英文： x-c3ll? ?譯文：FreeBuf.COM
www.freebuf.com/articles/system/163579.html
寫在前面的話
在此之前，我一直都在研究JavaScript相關的反調試技巧。但是當我在網上搜索相關資料時，我發現網上并沒有多少關于這方面的文章，而且就算有也是非常不完整的那種。所以在這篇文章中，我打算跟大家總結一下關于JavaScript反調試技巧方面的內容。值得一提的是，其中有些方法已經被網絡犯罪分子廣泛應用到惡意軟件之中了。
對于JavaScript來說，你只需要花一點時間進行調試和分析，你就能夠了解到JavaScript代碼段的功能邏輯。而我們所要討論的內容，可以給那些想要分析你JavaScript代碼的人增加一定的難度。不過我們的技術跟代碼混淆無關，我們主要針對的是如何給代碼主動調試增加困難。
本文所要介紹的技術方法大致如下：
1. 檢測未知的執行環境（我們的代碼只想在瀏覽器中被執行）；
2. 檢測調試工具（例如DevTools）；
3. 代碼完整性控制；
4. 流完整性控制；
5. 反模擬；
簡而言之，如果我們檢測到了“不正常”的情況，程序的運行流程將會改變，并跳轉到偽造的代碼塊，并“隱藏”真正的功能代碼。
一、函數重定義
這是一種最基本也是最常用的代碼反調試技術了。在JavaScript中，我們可以對用于收集信息的函數進行重定義。比如說，console.log()函數可以用來收集函數和變量等信息，并將其顯示在控制臺中。如果我們重新定義了這個函數，我們就可以修改它的行為，并隱藏特定信息或顯示偽造的信息。
我們可以直接在DevTools中運行這個函數來了解其功能：
console.log("HelloWorld");
var?fake?=?function()?{};
window['console']['log']=?fake;
console.log("Youcan't see me!");
運行后我們將會看到：
VM48:1 Hello World
你會發現第二條信息并沒有顯示，因為我們重新定義了這個函數，即“禁用”了它原本的功能。但是我們也可以讓它顯示偽造的信息。比如說這樣：
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!
實際上，為了控制代碼的執行方式，我們還能夠以更加聰明的方式來修改函數的功能。比如說，我們可以基于上述代碼來構建一個代碼段，并重定義eval函數。我們可以把JavaScript代碼傳遞給eval函數，接下來代碼將會被計算并執行。如果我們重定義了這個函數，我們就可以運行不同的代碼了：
//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!')");
運行結果如下：
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
正如之前所說的那樣，雖然這種方法非常巧妙，但這也是一種非常基礎和常見的方法，所以比較容易被檢測到。
二、斷點
為了幫助我們了解代碼的功能，JavaScript調試工具（例如DevTools）都可以通過設置斷點的方式阻止腳本代碼執行，而斷點也是代碼調試中最基本的了。
如果你研究過調試器或者x86架構，你可能會比較熟悉0xCC指令。在JavaScript中，我們有一個名叫debugger的類似指令。當我們在代碼中聲明了debugger函數后，腳本代碼將會在debugger指令這里停止運行。比如說：
console.log("Seeme!");
debugger;
console.log("Seeme!");
很多商業產品會在代碼中定義一個無限循環的debugger指令，不過某些瀏覽器會屏蔽這種代碼，而有些則不會。這種方法的主要目的就是讓那些想要調試你代碼的人感到厭煩，因為無限循環意味著代碼會不斷地彈出窗口來詢問你是否要繼續運行腳本代碼：
setTimeout(function(){while?(true)?{eval("debugger")
三、時間差異
這是一種從傳統反逆向技術那里借鑒過來的基于時間的反調試技巧。當腳本在DevTools等工具環境下執行時，運行速度會非常慢（時間久），所以我們就可以根據運行時間來判斷腳本當前是否正在被調試。比如說，我們可以通過測量代碼中兩個設置點之間的運行時間，然后用這個值作為參考，如果運行時間超過這個值，說明腳本當前在調試器中運行。
演示代碼如下：
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）
這項技術利用的是div元素中的id屬性，當div元素被發送至控制臺（例如console.log(div)）時，瀏覽器會自動嘗試獲取其中的元素id。如果代碼在調用了console.log之后又調用了getter方法，說明控制臺當前正在運行。
簡單的概念驗證代碼如下：
let?div?=?document.createElement('div');
let?loop?=?setInterval(()?=>?{
????console.log(div);
????console.clear();
});
Object.defineProperty(div,"id",?{get:?()?=>?{
????clearInterval(loop);
????alert("Dev Tools detected!");
}});
五、隱式流完整性控制
當我們嘗試對代碼進行反混淆處理時，我們首先會嘗試重命名某些函數或變量，但是在JavaScript中我們可以檢測函數名是否被修改過，或者說我們可以直接通過堆棧跟蹤來獲取其原始名稱或調用順序。
arguments.callee.caller可以幫助我們創建一個堆棧跟蹤來存儲之前執行過的函數，演示代碼如下：
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();
注意：源代碼的混淆程度越強，這個技術的效果就越好。
六、代理對象
代理對象是目前JavaScript中最有用的一個工具，這種對象可以幫助我們了解代碼中的其他對象，包括修改其行為以及觸發特定環境下的對象活動。比如說，我們可以創建一個嗲哩對象并跟蹤每一次document.createElemen調用，然后記錄下相關信息：
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');
接下來，我們可以在控制臺中記錄下相關參數和信息：
VM64:3?Intercepted?a?call?to?createElement with?args:?div
我們可以利用這些信息并通過攔截某些特定函數來調試代碼，但是本文的主要目的是為了介紹反調試技術，那么我們如何檢測“對方”是否使用了代理對象呢？其實這就是一場“貓抓老鼠”的游戲，比如說，我們可以使用相同的代碼段，然后嘗試調用toString方法并捕獲異常：
//Call a "virgin" createElement:
try?{
????document.createElement.toString();
}catch(e){
????console.log("I saw your proxy!");
}
信息如下：
"function createElement() { [native code] }"
但是當我們使用了代理之后：
//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!");
}
沒錯，我們確實可以檢測到代理：
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!");
}
現在我們就沒辦法檢測到了：
"function createElement() { [native code] }"
就像我說的，這就是一場“貓抓老鼠“的游戲。
總結
希望我所收集到的這些技巧可以對大家有所幫助，如果你有更好的技巧想跟大家分享，可以直接在文章下方的評論區留言，或者在Twitter上艾特我（@TheXC3LL）。
【關于投稿】
如果大家有原創好文投稿，請直接給公號發送留言。
①?留言格式：
【投稿】+《?文章標題》+?文章鏈接
②?示例：
【投稿】《不要自稱是程序員，我十多年的?IT?職場總結》：http://blog.jobbole.com/94148/
③?最后請附上您的個人簡介哈~
覺得本文對你有幫助？請分享給更多人
關注「前端大全」，提升前端技能
總結
以上是生活随笔為你收集整理的JavaScript 反调试技巧的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： html 有序无序列表,无序列表、有序列
- 下一篇： JS基础知识必看篇(黄梦岚)