如何使用chrome调试iphone页面？win10 remotedebug-ios-webkit-adapter 安装与使用

先放个原版教程链接，请戳这里 https://github.com/RemoteDebu…
使用chrome devtools 调试 iphone 页面，需安装 remotedebug-ios-webkit-adapter 工具。

这个 adapter 可牛批坏了，可以通过VS Code，Chrome DevTools，Mozilla Debugger.html和其他与Chrome调试协议兼容的工具调试iOS上的Safari和WebViews。

且看以下具体步骤。

开始
在使用此适配器之前，您需要确保安装了最新版本的iTunes，因为我们需要iTunes提供的一些库来与iOS设备通信。

安装依赖项
1、安装scoop（windows的包管理工具）

#修改执行策略，选择是 or 全是
set-executionpolicy unrestricted -s cu
#安装scoop
iex (new-object net.webclient).downloadstring(‘https://get.scoop.sh’)
2、通过scoop安装 ios_webkit_debug_proxy

scoop bucket add extras
scoop install ios-webkit-debug-proxy
npm install -g vs-libimobile
3、安装最新版本的 remotedebug-ios-webkit-adapter

npm install remotedebug-ios-webkit-adapter -g
4、在Safari中启用远程调试
为了显示您的iOS设备，您需要启用启用开发者模式进行调试。

Iphone => 设置 => Safari 浏览器 => 高级 => web检查器 => 启用
5、让您的计算机信任您的iOS设备
将Iphone手机连接电脑，必须点击“信任”，并打开 itunes, 以确保手机连接。

6、打开你喜欢的命令行工具，运行以下命令：

remotedebug_ios_webkit_adapter --port=9000
#ios-webkit-debug-proxy 将自动为您运行 无需单独启动
clipboard.png

7、 打开chrome, 输入网址： chrome://inspect/#devices
如下图所示，点击 inspect, 即可调试。

clipboard.png

恭喜你，现在可以愉快的调试网页了
clipboard.png

以下是iphone上看到的效果：
指哪打哪，简直不要太牛批
clipboard.png

PS：请多多指正！别忘记点个赞哟~ 并回敬您一个猿式的微笑。 😃

用Chrome devTools 调试Android手机app中的web页面

(1) 手机要满足Android系统为4.4或更高版本，低版本不支持这种方式。
(2) 确保App已经开启了webview的debug调试模式，由Android工程师协助。
(2) 用usb数据线连接好手机与电脑。
(3) 将手机中的 设置 - 开发人员工具 - USB调试功能打开。
(4) 打开chrome://inspect/#devices，即单击chrome右上角控制按钮 - 更多工具 - 检查设备 - 勾选上 Discover USB devices
(5) 在app中访问一个web页面,对应的webview就可以出现在devices中，单击inspect即可调试。