手頭上有個(gè)調(diào)試Echarts地圖在ios端顯示情況的任務(wù)纤垂,工作電腦是win10逸吵,因此在這里损肛,找到了方法厢破。
1 下載iTunes
在官網(wǎng)下載iTunes。才能識(shí)別連接的ios設(shè)備治拿。
2 開啟調(diào)試模式
在ios端打開設(shè)置->Safari->高級(jí)->Web檢查器
3 ios-webkit-debug-proxy
這里就是核心了摩泪。按照原博說法,ios-webkit-debug-proxy 是一個(gè) DevTools proxy 劫谅,項(xiàng)目托管在 Github 上见坑。其使得開發(fā)者可以發(fā)送命令到真實(shí)(或虛擬)IOS設(shè)備中的 Safari 瀏覽器或 UIWebViews 。
項(xiàng)目地址:https://github.com/artygus/ios-webkit-debug-proxy-win32捏检。
與原博相比荞驴,git上有一些更新:
在Binaries小節(jié)點(diǎn)擊x64 Build下載。下載后解壓縮贯城,并將解壓目錄添加到環(huán)境變量熊楼。
4 啟動(dòng)proxy
- 在控制臺(tái)執(zhí)行:
ios_webkit_debug_proxy.exe -f chrome-devtools://devtools/bundled/inspector.html
- 結(jié)果
Listing devices on :9221
Connected :9222 to iPad (3350272cc4155cd76e1990b18ad7a5a28689****)
說明啟動(dòng)成功
5 開始調(diào)試
- 在chrome瀏覽器地址欄輸入:http://localhost:9221/
會(huì)顯示所有設(shè)備清單:
iOS Devices:
localhost:9222 - iPad
- 點(diǎn)擊打開
可以發(fā)現(xiàn)地址欄變?yōu)椋?a target="_blank" rel="nofollow">http://localhost:9222/
同時(shí)顯示該ios設(shè)備中Safari瀏覽器打開的所有頁面,和一個(gè)提示:
Inspectable pages for iPad:
http://********Note: Your browser may block(https://code.google.com/p/chromium/issues/detail?id=87815)2
the above links with JavaScript console error: Not allowed to load local resource: chrome-devtools://...
To open a link: right-click on the link (control-click on Mac), 'Copy Link Address', and paste it into address bar.
提示顯示需要右鍵點(diǎn)擊點(diǎn)擊鏈接能犯,選擇復(fù)制鏈接地址鲫骗,再在新標(biāo)簽頁 中打開鏈接。
就能看到常見的chrome調(diào)試接口
6 缺點(diǎn)
- 發(fā)現(xiàn)console輸出無效踩晶。