工欲善其事必先利其器
曾幾何時(shí)，在v0.x版本的微信開(kāi)發(fā)者工具是自帶真機(jī)調(diào)試功能的，但從微信小程序橫空出世后，公眾號(hào)網(wǎng)頁(yè)開(kāi)發(fā)模式就找不到這個(gè)真機(jī)調(diào)試的功能了...，估計(jì)是“失寵”了吧 o(╥﹏╥)o
于是乎，有很多小伙伴就開(kāi)始懵了 => 微信網(wǎng)頁(yè)如何進(jìn)行開(kāi)發(fā)功能調(diào)試？
正所謂辦法總比困難多，下面以微信為例介紹幾個(gè)內(nèi)嵌webview開(kāi)發(fā)調(diào)試技巧，總有方法適合你的（如果沒(méi)有，歡迎留言提出，大家一起交流）
首當(dāng)其沖的是官方的微信開(kāi)發(fā)者工具，能解決問(wèn)題的話當(dāng)然就不必使用下面方法了
-
（僅限安卓端）chorme瀏覽器inspect調(diào)試
- 在微信中打開(kāi)http://debugx5.qq.com（“文件傳輸文件”用起來(lái)）
- 切換“信息”tab，勾選打開(kāi)TBS內(nèi)核inspector調(diào)試功能
- 連接手機(jī)在chorme瀏覽器打開(kāi)chrome://inspect/#devices
-
Fiddler設(shè)置
- 打開(kāi)Fiddler，右側(cè)有AutoResponder選項(xiàng)，
- 勾選 Enable automaticresponses 和 Unmatched request passthrough 選項(xiàng)
- 左邊找到需調(diào)試的文件，如果看不到請(qǐng)求，有可能是緩存，退出微信重新登錄，注意不是殺掉進(jìn)程，將文件拖拽至右側(cè)
- 在Rule Editor中的第二行，點(diǎn)擊下拉選項(xiàng)最后選項(xiàng)為“Find a file”選擇目標(biāo)文件
- 在chorme瀏覽器打開(kāi)chrome://inspect/#devices
image -
插件
將插件打入應(yīng)用或頁(yè)面中，然后打開(kāi)調(diào)試查看相關(guān)信息
將調(diào)試插件打入應(yīng)用，通過(guò)特殊手勢(shì)或者隱藏開(kāi)關(guān)即所謂“后門”開(kāi)啟， 此方法有助于解決版本上線后，客戶表示出現(xiàn)bug，但我們又無(wú)法重現(xiàn)的情況
image移動(dòng)調(diào)試插件很多，這里簡(jiǎn)單舉兩個(gè)例子：Vconsole和eruda，可查閱相關(guān)資料
https://github.com/Tencent/vConsole/blob/dev/doc/tutorial_CN.md
https://github.com/liriliri/eruda/blob/master/doc/README_CN.md
5.spy-debugger
spy-debugger是一站式頁(yè)面調(diào)試、抓包工具，上手容易且較為強(qiáng)大。
推薦鏈接：https://github.com/wuchangming/spy-debugger
