前言

在前端逆向工程中，加解密邏輯往往隱藏在海量代碼、動(dòng)態(tài)加載腳本或混淆代碼中，直接查找加密函數(shù)如同“大海撈針”。想要高效定位核心邏輯，必須先掌握堆棧原理（理解代碼執(zhí)行脈絡(luò)），再結(jié)合合適的定位方式（精準(zhǔn)鎖定關(guān)鍵代碼）。本文將先拆解堆棧的底層邏輯，再詳細(xì)講解全局搜索、事件斷點(diǎn)、XHR/Fetch斷點(diǎn)、啟動(dòng)器調(diào)試四種核心定位方式，幫助逆向工程師建立“先懂流程，再找代碼”的逆向思維。

一、堆棧原理：理解JS代碼的“執(zhí)行脈絡(luò)”

在定位加解密邏輯前，必須先搞懂“堆棧”是什么——它是瀏覽器記錄函數(shù)調(diào)用關(guān)系的核心機(jī)制，如同一張“代碼執(zhí)行地圖”，能幫我們還原從“觸發(fā)操作”到“加密執(zhí)行”再到“請求發(fā)送”的完整鏈路。

1. 堆棧的核心概念

• 調(diào)用堆棧（Call Stack）：當(dāng)JS代碼執(zhí)行時(shí)，每調(diào)用一個(gè)函數(shù)，瀏覽器會將該函數(shù)的執(zhí)行上下文（如參數(shù)、局部變量、執(zhí)行位置）壓入“棧”中；函數(shù)執(zhí)行完畢后，會從棧中彈出。最終，堆棧會記錄當(dāng)前所有未執(zhí)行完畢的函數(shù)調(diào)用關(guān)系。
• 棧的特性：后進(jìn)先出（LIFO）：最后被調(diào)用的函數(shù)會壓在棧頂，最先執(zhí)行完畢并彈出；最先被調(diào)用的函數(shù)壓在棧底，最后執(zhí)行完畢。
• 堆棧與執(zhí)行順序的關(guān)系：
  • 堆棧展示順序：從上到下 = 調(diào)用順序（后調(diào)用的函數(shù)在棧頂）；
  • 代碼執(zhí)行順序：從下到上 = 執(zhí)行順序（棧底的函數(shù)最先執(zhí)行，棧頂?shù)暮瘮?shù)當(dāng)前正在執(zhí)行）。

2. 堆棧在逆向中的核心作用

逆向加解密的本質(zhì)是“追溯數(shù)據(jù)流向”——從“加密后的密文”反向找到“明文輸入”和“加密函數(shù)”。而堆棧恰好能提供這條“追溯路徑”：

• 當(dāng)代碼暫停在某一位置（如請求發(fā)送、加密執(zhí)行）時(shí)，通過堆?？上蛏希５追较颍┳匪?ldquo;誰調(diào)用了當(dāng)前函數(shù)”，逐步找到明文參數(shù)的來源和加密函數(shù)的入口；
• 避免盲目搜索代碼，精準(zhǔn)鎖定與加解密相關(guān)的函數(shù)調(diào)用鏈，忽略無關(guān)代碼干擾。

3. 堆棧示例：還原加密執(zhí)行流程

假設(shè)某網(wǎng)站登錄的加密執(zhí)行鏈路如下：

// 1. 頁面加載時(shí)綁定點(diǎn)擊事件
window.onload = function() {
  document.querySelector('.login-btn').addEventListener('click', handleLogin); // 步驟1：綁定事件
};

// 2. 點(diǎn)擊按鈕觸發(fā)事件回調(diào)
function handleLogin() {
  const username = document.getElementById('username').value;
  const password = document.getElementById('password').value;
  const encryptedPwd = encryptPassword(password); // 步驟2：調(diào)用加密函數(shù)
  submitRequest(username, encryptedPwd); // 步驟3：調(diào)用請求提交函數(shù)
}

// 3. 密碼加密核心函數(shù)
function encryptPassword(pwd) {
  return CryptoJS.MD5(pwd + 'salt123').toString(); // 步驟4：執(zhí)行加密
}

// 4. 提交請求
function submitRequest(username, pwd) {
  const xhr = new XMLHttpRequest();
  xhr.open('POST', '/user/login');
  xhr.send(JSON.stringify({ username, password: pwd })); // 步驟5：發(fā)送請求
}

當(dāng)我們在xhr.send()處觸發(fā)斷點(diǎn)時(shí)，調(diào)用堆棧（Call Stack）會顯示如下（從上到下）：

send @ xhr.js:50  // 棧頂：當(dāng)前正在執(zhí)行的函數(shù)（請求發(fā)送）
submitRequest @ login.js:30  // 調(diào)用send的函數(shù)（組裝請求）
handleLogin @ login.js:15  // 調(diào)用submitRequest的函數(shù)（事件回調(diào)）
(anonymous) @ login.js:5  // 棧底：最先執(zhí)行的函數(shù)（綁定事件）

此時(shí)通過堆棧追溯：

• 棧頂send：確認(rèn)請求已組裝完成，password是密文；
• 上一層submitRequest：找到密文pwd的來源是encryptedPwd參數(shù)；
• 再上一層handleLogin：找到encryptedPwd是encryptPassword(password)的返回值，且password是表單輸入的明文；
• 最終定位到加密核心函數(shù)encryptPassword。

二、四大定位方式：精準(zhǔn)鎖定加解密邏輯

掌握堆棧原理后，結(jié)合以下四種定位方式，可覆蓋絕大多數(shù)前端加解密場景。每種方式各有適用場景，需根據(jù)“是否已知函數(shù)名、是否已知接口、觸發(fā)方式”靈活選擇。

1. 全局搜索：最快定位已知特征的加密函數(shù)

全局搜索是最直接的定位方式，適用于已知加密相關(guān)特征的場景（如加密函數(shù)名、參數(shù)名、關(guān)鍵字），核心是通過“特征匹配”快速鎖定可疑代碼。

核心原理

前端加解密邏輯往往包含明顯的特征關(guān)鍵詞，如：

• 函數(shù)/參數(shù)名：encrypt（加密）、decrypt（解密）、sign（簽名）、password（密碼）、salt（鹽值）、key（密鑰）；
• 算法關(guān)鍵詞：MD5、SHA256、AES、RSA、CryptoJS（常用加密庫）；
• 操作關(guān)鍵詞：base64、encode（編碼）、decode（解碼）。

通過瀏覽器開發(fā)者工具的全局搜索功能，匹配這些關(guān)鍵詞，可快速找到疑似加密函數(shù)。

操作步驟

1. 打開瀏覽器開發(fā)者工具（F12），切換到「Sources」面板；
2. 按下「Ctrl+Shift+F」（全局搜索快捷鍵），輸入關(guān)鍵詞（如encrypt、CryptoJS、password）；
3. 搜索結(jié)果會顯示所有匹配的文件和代碼行，點(diǎn)擊結(jié)果可直接跳轉(zhuǎn)到對應(yīng)代碼；
4. 在疑似加密函數(shù)的入口處設(shè)置普通斷點(diǎn)，觸發(fā)加密操作（如點(diǎn)擊登錄），觀察變量和執(zhí)行流程。

進(jìn)階技巧

• 模糊匹配：若不確定完整關(guān)鍵詞，可使用通配符（如encry*匹配encrypt、encryptPassword）；
• 多關(guān)鍵詞組合：同時(shí)搜索encrypt+password，縮小匹配范圍；
• 排除框架代碼：搜索結(jié)果中若包含jquery.js、vue.js等框架文件，可勾選「Filter」篩選業(yè)務(wù)代碼文件（如login.js、api.js）。

優(yōu)劣分析

• 優(yōu)勢：操作最快、效率最高，適合有明確特征的場景（如已知用CryptoJS加密、參數(shù)名是sign）；
• 劣勢：對無明顯特征的加密邏輯無效（如函數(shù)名被混淆為a、b，無關(guān)鍵詞）。

實(shí)戰(zhàn)場景

某網(wǎng)站登錄時(shí)密碼加密，已知前端使用CryptoJS庫，通過全局搜索：

1. 輸入關(guān)鍵詞CryptoJS，找到login.js中包含CryptoJS.AES.encrypt的代碼；
2. 定位到函數(shù)function d(e) { return CryptoJS.AES.encrypt(e, 'key123').toString() }；
3. 在該函數(shù)第一行設(shè)置斷點(diǎn)，點(diǎn)擊登錄，代碼暫停，觀察到e是輸入的明文密碼，確認(rèn)這是核心加密函數(shù)。

2. 事件斷點(diǎn)：追溯用戶操作觸發(fā)的加密邏輯

事件斷點(diǎn)適用于加密邏輯由用戶操作觸發(fā)的場景（如點(diǎn)擊登錄按鈕、提交表單、輸入文本），無需提前知道任何代碼特征，通過“捕獲用戶事件”反向追溯加密函數(shù)。

核心原理

用戶操作（點(diǎn)擊、輸入、提交）會觸發(fā)DOM事件（click、submit、input），而加解密邏輯通常在事件的回調(diào)函數(shù)中執(zhí)行（如點(diǎn)擊登錄按鈕后，回調(diào)函數(shù)中獲取表單數(shù)據(jù)并加密）。通過給DOM元素或全局事件設(shè)置斷點(diǎn)，可在事件觸發(fā)時(shí)暫停代碼，再通過堆棧追溯到加密函數(shù)。

兩種事件斷點(diǎn)用法

（1）元素級事件斷點(diǎn)（精準(zhǔn)）

適用于已知觸發(fā)加密的具體DOM元素（如登錄按鈕、提交按鈕）：

1. 切換到「Elements」面板，通過「Ctrl+Shift+C」選中目標(biāo)元素（如登錄按鈕<button class="login-btn">）；
2. 右鍵點(diǎn)擊該元素，選擇「Break on」→ 「Attribute modifications」（屬性修改，如按鈕禁用狀態(tài)變化）或「Event handlers」（直接捕獲事件回調(diào)）；
3. 觸發(fā)用戶操作（如點(diǎn)擊按鈕），代碼會暫停在事件回調(diào)函數(shù)中；
4. 通過調(diào)用堆棧向上追溯，找到加密函數(shù)。

（2）全局事件斷點(diǎn)（廣譜）

適用于未知具體觸發(fā)元素，但知道事件類型（如click、submit）：

1. 切換到「Sources」面板，展開「Event Listener Breakpoints」；
2. 勾選對應(yīng)事件類型（如「Mouse → click」、「Form → submit」）；
3. 觸發(fā)用戶操作，代碼會暫停在所有click或submit事件的回調(diào)函數(shù)中；
4. 結(jié)合堆棧和代碼邏輯，篩選出與加解密相關(guān)的回調(diào)函數(shù)。

優(yōu)劣分析

• 優(yōu)勢：無需提前了解代碼結(jié)構(gòu)，覆蓋范圍廣，適合加密函數(shù)隱藏深、無明顯特征的場景；
• 劣勢：可能觸發(fā)大量無關(guān)事件（如頁面其他元素的點(diǎn)擊），需要耐心篩選堆棧。

實(shí)戰(zhàn)場景

某網(wǎng)站登錄按鈕點(diǎn)擊后無明顯加密關(guān)鍵詞，通過元素級事件斷點(diǎn)：

1. 選中登錄按鈕，右鍵「Break on」→「Event handlers」→「click」；
2. 點(diǎn)擊按鈕，代碼暫停在handleLogin回調(diào)函數(shù)中；
3. 查看堆棧，發(fā)現(xiàn)handleLogin調(diào)用了f(pwd)，進(jìn)入f函數(shù)后，看到return btoa(pwd + 'salt')（Base64編碼加密），成功定位加密邏輯。

3. XHR/Fetch斷點(diǎn)：從請求出發(fā)逆向加密源頭

XHR/Fetch斷點(diǎn)適用于已知加密參數(shù)所在接口的場景（如登錄接口/user/login、數(shù)據(jù)接口/api/data），核心是“攔截請求發(fā)送過程”，通過堆棧逆向追溯參數(shù)加密的源頭。

核心原理

所有前端請求（XHR或Fetch）發(fā)送前，必須先完成參數(shù)組裝和加密（如將明文密碼轉(zhuǎn)為密文、生成sign簽名）。給目標(biāo)接口設(shè)置斷點(diǎn)后，當(dāng)JS執(zhí)行到XMLHttpRequest.send()或fetch()時(shí)會自動(dòng)暫停，此時(shí)堆棧中會保留從“加密函數(shù)”到“請求發(fā)送”的完整調(diào)用鏈，向上追溯即可找到加密邏輯。

操作步驟

1. 切換到「Sources」面板，點(diǎn)擊「XHR/Fetch Breakpoints」標(biāo)簽；
2. 點(diǎn)擊「+」號，輸入目標(biāo)接口的路徑（支持精確匹配和模糊匹配）：
   • 精確匹配：/user/login（僅攔截該接口）；
   • 模糊匹配：/api/（攔截所有包含/api/的接口）；
3. 觸發(fā)請求（如點(diǎn)擊登錄、刷新頁面），當(dāng)請求即將發(fā)送時(shí)，代碼會暫停在send()或fetch()處；
4. 查看「Call Stack」調(diào)用堆棧，從棧頂（send函數(shù)）向上追溯，找到參數(shù)加密的關(guān)鍵函數(shù)。

關(guān)鍵技巧

• 觀察請求數(shù)據(jù)：暫停后，通過「Scope」面板查看send()的參數(shù)（如請求體data），確認(rèn)哪些參數(shù)是加密后的密文（如password、sign）；
• 跳過框架代碼：堆棧中若包含axios.js、fetch.js等請求庫代碼，可通過「黑盒腳本」（Blackbox Script）隱藏，專注于業(yè)務(wù)代碼；
• 結(jié)合條件斷點(diǎn)：若同一接口有多次請求（如分頁加載），可給XHR斷點(diǎn)添加條件（如url.includes('login')），僅攔截目標(biāo)請求。

優(yōu)劣分析

• 優(yōu)勢：精準(zhǔn)鎖定與請求相關(guān)的加密邏輯，無無關(guān)干擾，是登錄、數(shù)據(jù)提交接口逆向的首選方式；
• 劣勢：僅支持XHR/Fetch請求，不支持form表單提交、script標(biāo)簽動(dòng)態(tài)加載等非異步請求。

實(shí)戰(zhàn)場景

某網(wǎng)站數(shù)據(jù)接口/api/getData的請求參數(shù)包含sign（簽名），通過XHR斷點(diǎn)：

1. 添加XHR斷點(diǎn)，輸入/api/getData；
2. 刷新頁面觸發(fā)請求，代碼暫停在xhr.send()處；
3. 查看堆棧，向上追溯到buildParams函數(shù)，發(fā)現(xiàn)該函數(shù)接收原始參數(shù)（page=1&size=10）；
4. 繼續(xù)向上追溯到generateSign函數(shù)，看到sign的生成邏輯：md5(params + timestamp + 'secretKey')，成功還原簽名算法。

4. 啟動(dòng)器：網(wǎng)絡(luò)面板的“快捷堆棧工具”

啟動(dòng)器（Initiator）是瀏覽器「Network」面板中XHR/Fetch請求的內(nèi)置功能——無需手動(dòng)設(shè)置斷點(diǎn)，可直接查看該請求的“調(diào)用堆棧”，快速關(guān)聯(lián)到請求對應(yīng)的JS代碼，是效率最高的定位方式之一。

核心原理

每個(gè)前端請求都有“啟動(dòng)者”（即觸發(fā)該請求的JS函數(shù)），啟動(dòng)器功能會記錄請求的完整調(diào)用堆棧，并直接提供代碼跳轉(zhuǎn)入口。逆向時(shí)，通過啟動(dòng)器可跳過“設(shè)置斷點(diǎn)-觸發(fā)暫停”的步驟，直接從請求關(guān)聯(lián)到加密函數(shù)所在的代碼位置。

操作步驟

1. 打開開發(fā)者工具（F12），切換到「Network」面板；
2. 篩選請求類型：點(diǎn)擊「XHR」或「Fetch」，只顯示目標(biāo)請求類型；
3. 觸發(fā)目標(biāo)請求（如點(diǎn)擊登錄、刷新頁面），找到需要逆向的接口（如/user/login）；
4. 點(diǎn)擊該請求，在右側(cè)詳情面板中切換到「Initiator」（啟動(dòng)器）標(biāo)簽；
5. 查看調(diào)用堆棧：堆棧從上到下是“調(diào)用順序”，點(diǎn)擊任意堆棧條目，可直接跳轉(zhuǎn)到對應(yīng)的JS代碼行；
6. 追溯加密邏輯：從堆棧的“請求發(fā)送函數(shù)”（如send、fetch）向上追溯，找到參數(shù)加密的核心函數(shù)。

優(yōu)劣分析

• 優(yōu)勢：無需手動(dòng)斷點(diǎn)，直接通過請求關(guān)聯(lián)堆棧，省去設(shè)置斷點(diǎn)、觸發(fā)暫停的步驟，效率極高；
• 劣勢：僅能查看“已發(fā)送請求”的堆棧，若加密邏輯在請求發(fā)送前被攔截（如條件不滿足），則無法捕獲；部分混淆代碼可能導(dǎo)致堆棧顯示不完整。

實(shí)戰(zhàn)場景

某網(wǎng)站登錄接口/user/login的password參數(shù)是加密值，通過啟動(dòng)器快速定位：

1. 打開「Network」→「XHR」，點(diǎn)擊登錄按鈕，找到/user/login請求；
2. 點(diǎn)擊該請求，切換到「Initiator」標(biāo)簽，看到堆棧如下（從上到下）：

   fetch @ fetch.js:30
   sendLoginReq @ login.js:40
   encryptAndSubmit @ login.js:25
   handleLoginClick @ login.js:15
   

3. 點(diǎn)擊堆棧條目encryptAndSubmit @ login.js:25，直接跳轉(zhuǎn)到該函數(shù)代碼：

   function encryptAndSubmit() {
     const pwd = document.getElementById('pwd').value;
     const encryptedPwd = cryptoFunc(pwd); // 加密函數(shù)
     sendLoginReq(encryptedPwd);
   }
   

4. 再點(diǎn)擊cryptoFunc函數(shù)，即可查看完整加密邏輯，全程無需設(shè)置任何斷點(diǎn)。

三、四大定位方式選擇指南

四、總結(jié)：逆向加解密的核心邏輯閉環(huán)

JS逆向加解密的本質(zhì)是“追溯數(shù)據(jù)流向”，而堆棧原理是“追溯的工具”，四大定位方式是“追溯的入口”。完整的逆向流程可總結(jié)為：

1. 場景分析：明確加密觸發(fā)時(shí)機(jī)（用戶操作/頁面加載）、相關(guān)接口/元素、是否有已知特征；
2. 選擇入口：根據(jù)場景匹配定位方式（全局搜索/事件斷點(diǎn)/XHR斷點(diǎn)/啟動(dòng)器調(diào)試）；
3. 觸發(fā)斷點(diǎn)：執(zhí)行對應(yīng)操作（點(diǎn)擊/刷新/輸入），讓代碼暫停在關(guān)鍵位置；
4. 堆棧追溯：從暫停位置向上追溯，還原“明文輸入→加密執(zhí)行→密文輸出→請求發(fā)送”的完整鏈路；
5. 還原邏輯：通過單步執(zhí)行、變量觀察，明確加密算法（如AES/MD5）、密鑰/鹽值、參數(shù)組合規(guī)則，最終復(fù)現(xiàn)加密過程。

到此這篇關(guān)于JS逆向加解密之堆棧原理與四大定位技巧的文章就介紹到這了,更多相關(guān)JS逆向加解密內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論