# 使用chrome浏览器调试android&ios的webview中H5页面
谷歌浏览器调试内嵌Android WebView的H5页面 (opens new window)
谷歌浏览器调试内嵌IOS WebView的H5页面 (opens new window)
# 先期条件：
IOS:
- 打debug包而不是release包，证书也要用debug证书
- npm 安装插件
PS C:>npm install -g remotedebug-ios-webkit-adapter
C:\Users\Administrator\AppData\Roaming\npm\remotedebug_ios_webkit_adapter -> C:\Users\Administrator\AppData\Roaming\npm\
node_modules\remotedebug-ios-webkit-adapter\out\index.js
+ remotedebug-ios-webkit-adapter@0.2.2
added 120 packages in 38.854s
1
2
3
4
5
2
3
4
5
- 运行remotedebug_ios_webkit_adapter
PS C:>remotedebug_ios_webkit_adapter --port=9000
1
找到remotedebug-ios-webkit-adapter包地址，在node_modules/vs-libimobile文件夹下新建 x64文件夹
下载ios-webkit-debug-proxy (opens new window)包后，解压该包到上述文件夹下
在 x64 文件夹下运行ios_webkit_debug_proxy
PS C:\Users\Administrator\AppData\Roaming\npm\node_modules\remotedebug-ios-webkit-a
dapter\node_modules\vs-libimobile\x64>ios_webkit_debug_proxy
Listing devices on :9221
Unable to connect to 瀛欒繛榫欑殑 iPhone (b9a9c08475914881a0a82cda5125161a253491
95)
Please verify that Settings > Safari > Advanced > Web Inspector = ON
1
2
3
4
5
6
7
2
3
4
5
6
7
- ios 手机设置->Safari浏览器->高级 打开JavaScript和web检查器
android：
- 4.4版本及以上
- 在webView设置中加如下代码
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT){
webView.setWebContentsDebuggingEnabled(true);
}
1
2
3
2
3
- 打开 开发者调试
#
- 打开 chrome浏览器
chrome://inspect/#devices
- 手机进入app的webview中H5页面
- 点击 inspect