JS打斷點(diǎn)的六種常用姿勢你用過幾種
大家好,今天分享一下斷點(diǎn)的多種用法。
正常斷點(diǎn)
說到 JS 斷點(diǎn),大家可能很熟悉了,在 JS 逆向中,斷點(diǎn)是很常用的一種調(diào)試手段,只要在想要打斷點(diǎn)的行號上輕輕的點(diǎn)一下,斷點(diǎn)就打好了。
或者在行號上點(diǎn)擊右鍵,選擇斷點(diǎn)也可以添加一個斷點(diǎn)在指定的位置。
這個時候重新刷新頁面,如果斷點(diǎn)的位置沒錯的話,JS 就會斷在斷點(diǎn)的位置,這個時候可以在控制臺查看變量的值,甚至可以修改任意變量的值,修改后的值會立即生效。
正常斷點(diǎn)的顏色是藍(lán)色的。
條件斷點(diǎn)
和正常的斷點(diǎn)一樣,在行號處點(diǎn)擊右鍵,選擇條件斷點(diǎn),會彈出一個輸入框,輸入所需要斷下的條件,回車即可。
條件斷點(diǎn)的顏色是黃色的,而且會帶一個小問號在行號的前面。條件斷點(diǎn)只會在條件滿足的時候斷下,適合在需要特定條件調(diào)試的情況下使用。
日志斷點(diǎn)
還有一個是日志斷點(diǎn),它不會在斷點(diǎn)的位置斷下,但是會在命中日志斷點(diǎn)的時候輸出一行日志。
打好的斷點(diǎn)會變成粉紅色,而且在命中斷點(diǎn)的時候會輸出 num
和 data
的值,在日志的右側(cè)還會輸出斷點(diǎn)所在的行號。條件斷點(diǎn)一般在 jsvmp 中會經(jīng)常用到,因為 jsvmp 有自己的自定義指令和解釋器,一般會選擇使用插樁的方式將不同變量和寄存器的值打印出來分析算法。
XHR 斷點(diǎn)
XHR 斷點(diǎn)可以在任意 XHR 請求發(fā)送的時候斷下,也可以在包含某些關(guān)鍵字的請求發(fā)送的時候斷下。
如果想要在包含某個關(guān)鍵字的時候斷下,可以點(diǎn)擊加號,填寫想要斷下的關(guān)鍵字即可。
斷下時,會自動斷在 send
方法的位置,可以看到左側(cè)并沒有添加正常斷點(diǎn),而且右側(cè)斷點(diǎn)類型的文字會自動變成黃色。
事件斷點(diǎn)
在 XHR 斷點(diǎn)的下方,有一個事件監(jiān)聽器斷點(diǎn)。
它可以對幾乎所有的事件下斷點(diǎn),例如鼠標(biāo)的點(diǎn)擊事件,移動事件,雙擊事件等等,一般用于在驗證碼滑塊或者點(diǎn)擊類的驗證碼邏輯調(diào)試的時候會用到。
選中單擊斷點(diǎn)后,在頁面的任意位置點(diǎn)擊一下,會自動觸發(fā)斷點(diǎn),可以看到斷點(diǎn)的處理函數(shù)會傳入一個 g 參數(shù),這個參數(shù)中保存了我當(dāng)前點(diǎn)擊鼠標(biāo)的位置,還有其他很多參數(shù),用于處理單擊事件。
DOM 斷點(diǎn)
DOM 斷點(diǎn)一般用于調(diào)試在有新的元素新建或者刪除的時候用。
例如我在這里添加一個子樹修改斷點(diǎn),因為在翻頁的時候肯定會修改子樹的。
添加好 DOM 斷點(diǎn)后,元素前面會有一個小小的藍(lán)色點(diǎn)點(diǎn),同時也可以在 DOM 斷點(diǎn)的標(biāo)簽中看到已經(jīng)對哪一個元素添加了 DOM 斷點(diǎn)?,F(xiàn)在點(diǎn)擊下一頁試試:
斷點(diǎn)斷下來了,看右側(cè)的調(diào)用棧,先是發(fā)送請求,然后調(diào)用了 success 方法解析數(shù)據(jù),最終通過 jQuery 來將數(shù)據(jù)填充到 DOM 樹中。如果沒有 XHR 斷點(diǎn)的話,也可以使用這種方式來查找請求發(fā)送的位置。
總結(jié)
在越來越復(fù)雜的 JS 代碼中,斷點(diǎn)對于逆向是必不可少的,但是在遇到一些特殊需求或者正常斷點(diǎn)難以解決的問題時,也可以多試試其他斷點(diǎn),有的時候一個正確的方法可以事半功倍。
到此這篇關(guān)于JS打斷點(diǎn)的六種常用姿勢的文章就介紹到這了,更多相關(guān)JS打斷點(diǎn)姿勢內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JS實現(xiàn)transform實現(xiàn)扇子效果
這篇文章主要為大家詳細(xì)介紹了JS實現(xiàn)transform實現(xiàn)扇子效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2020-01-01chrome瀏覽器不支持onmouseleave事件的解決技巧
發(fā)現(xiàn)給div加的 onmouseleave事件在chrome 中不起效果,下面與大家分享下具體的解決方法,不會的朋友可以了解下哈,希望對大家有所幫助2013-05-05JS實現(xiàn)單張或多張圖片持續(xù)無縫滾動的示例代碼
這篇文章主要介紹了JS實現(xiàn)單張或多張圖片持續(xù)無縫滾動效果,本文通過實例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-05-05微信小程序?qū)崿F(xiàn)拖動懸浮圖標(biāo)效果
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)拖動懸浮圖標(biāo)效果,小程序上是實現(xiàn)拖動圖標(biāo),本文通過實例代碼給大家介紹的非常詳細(xì),感興趣的朋友跟隨小編一起看看吧2024-04-04