移動端真機除錯神器 spy debugger

2022-07-10 11:27:11 字數 1541 閱讀 4086

language: english

1、頁面除錯＋抓包

2、操作簡單，無需usb連線裝置

3、支援https。

4、spy-debugger內部整合了weinre、node-mitmproxy、anyproxy

頁面編輯模式

啟動命令：spy-debugger -w true

weiner頁面除錯介面

anyproxy抓包介面

windows 下

npm install spy-debugger -g
mac 下

sudo npm install spy-debugger -g
第一步：手機和pc保持在同一網路下（比如同時連到乙個wi-fi下）

(位址***)安裝證書（手機首次除錯需要安裝證書，已安裝了證書的手機無需重複安裝)。ios新安裝的證書需要手動開啟證書信任

***位址（如下，避免被牆，提前截圖了）

注意⚠️ ios下除錯https需要手動開啟證書信任（不只需要安裝，還要手動開啟信任開關）

第五步：用手機瀏覽器訪問你要除錯的頁面即可。

埠(預設埠：9888)

spy-debugger -p 8888
設定外部**（預設使用anyproxy）
spy-debugger -e
spy-debugger內建anyproxy提供抓包功能，但是也可通過設定外部**和其它抓包**工具一起使用，如：charles、fiddler。

設定頁面內容為可編輯模式

該功能使頁面內容修改更加直觀方便。 (預設： false)

spy-debugger -w true
內部實現原理：在需要除錯的頁面內注入**：document.body.contenteditable=true。暫不支援使用了iscroll框架的頁面。

是否允許weinre監控iframe載入的頁面

(預設： false)

spy-debugger -i true
是否只攔截瀏覽器發起的https請求

(預設： true)

spy-debugger -b false
是否允許http快取

(預設： false)

spy-debugger -c true

移動端開發真機除錯 神器

本篇部落格預設你已會使用gulp，npm 並且環境已經搭好 找到目錄中的 package.json，在檔案中新增相關依賴包 1 dependencies 1 var browsersync require browser sync create 自動同步 1 gulp.task browser sy...

Mac iPhone 移動端真機除錯

之前除錯移動端頁面各種不方便，現在有了 mac iphone 簡直是如有神助了，相見恨晚！在此記錄一二備忘。首先在 iphone 上設定 settings safari advanced web inspector 選擇開啟然後在 mac 上設定 開啟 safari，此時選單欄上應該有個 devel...

移動端真機除錯方法介紹

weinre除錯 spy debugger除錯 先說一下每一種方式的優缺點。第一種，chrome真機除錯，有乙個很大的侷限性就是，只能除錯手機端的chrome瀏覽器，對於uc，qq這些瀏覽器均不適用，因此在除錯相容問題時，幫助不大，但是最大的優點是 簡單快捷。第二種，weinre除錯方式，安裝和適用...