window debug ios webview

业务需求

在window上想要debug在ios的应用中的webview页面，毕竟页面是在安卓端和ios端都有webview的。安卓的页面使用edge的edge://inspect/#devices，手机开启调试模式就可以了。对于ios就没有办法，页面中已经使用了vconsole可以看到部分的信息，vconsole的信息也是没有chrome调试那么好。

在YouTube上找到一些在window中调试webview的页面，使用remotedebug-ios-webkit-adapter，把调试的大概步骤记录了一下。

安装使用edge监听usb连接ios进行调试

1、安装remotedebug-ios-webkit-adapter

在nodejs中全局安装remotedebug-ios-webkit-adapter，命令如下：

npm install -g remotedebug-ios-webkit-adapter

powershell中执行启动监听的服务：

remotedebug_webkit_adapter --port=9000 
# remotedebug_ios_webkit_adapter --port [9000]

执行启动项目的命令报错

C:\WINDOWS\system32> remotedebug_ios_webkit_adapter --port=9099
remotedebug-ios-webkit-adapter failed to run with the following error: 
ios_webkit_debug_proxy.exe not found. 
Please install 'scoop install ios-webkit-debug-proxy'

需要安装这个ios-webkit-debug-proxy，看到这个需要使用scoop进行安装。scoop和chocolatey都是window端的应用包管理，可以使用命令行进行应用安装。

2、安装scoop和ios-webkit-debug-proxy

安装scoop的时候报错，这个问题改成不是administrator的powershell窗口就可以了。

C:\WINDOWS\system32> irm get.scoop.sh | iex
Initializing... Running the installer as administrator is disabled by default, 
see https://github.com/ScoopInstaller/Install#for-admin for details. Abort.

安装scoop的时候报错，网络原因，应该是网络的问题，想想办法找一些可以访问的资源。

PS C:\Users\Alvin\scoop\shims> irm get.scoop.sh | iex
Initializing...
Downloading ...
fatal: unable to access 'https://github.com/ScoopInstaller/Scoop.git/': 
Recv failure: Connection was reset fatal: 
destination path 'C:\Users\Alvin\scoop\buckets\main' 
already exists and is not an empty directory. Creating shim... Resolve-Path : 
找不到路径“C:\Users\Alvin\scoop\apps\scoop\current\bin\scoop.ps1”，因为该路径不存在。 
所在位置 行:309 字符: 21 + $relativePath = Resolve-Path -Relative 
$path + ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ + CategoryInfo : ObjectNotFound: 
(C:\Users\Alvin\...t\bin\scoop.ps1:String) [Resolve-Path ], 
ItemNotFoundException + FullyQualifiedErrorId : 
PathNotFound,Microsoft.PowerShell.Commands.ResolvePathCommand

scoop的使用方法

# 查看安装的目录
dir ~\scoop

# 安装ios-webkit-debug-proxy应用包
scoop bucket add extras 
scoop install ios-webkit-debug-proxy

# 查找应用包
scoop search ios-webkit-debug-proxy

3、启动监听服务

装上了ios-webkit-debug-proxy之后再启动项目就可以了

# powershell 
PS C:\Users\Alvin> remotedebug_ios_webkit_adapter --port=9099
remotedebug-ios-webkit-adapter is listening on port 9099

4、使用ios手机连接window

ios手机连接，然后信任调试，然后chrome 执行chrome://inspect/#devices（chrome会有启动inspect的会有网络问题），edge执行edge://inspect/#devices，设置discover network targets -> localhost:9000，稍等一小会，页面中出现Target (RemoteDebug iOS Webkit Adapter)，点击inspect后就可以了

其他

尝试使用chocolatey来进行安装ios-webkit-debug-proxy，chocolatey和scoop一样也是window端的命令行安装应用的工具，发现choco好像没有这个包，能够使用choco installl [packageName] 命令，不过也没有装成功，估计也是网络的问题。