通过Chrome DevTools USB调试Cordova安卓应用出现空白页问题

我之前也碰到过类似的调试兼容性问题，结合社区实操经验，给你几个可行的解决思路：

1. 降级Chrome金丝雀到稳定兼容版本 #

这个错误大概率是金丝雀版（65.0.3319.0）的DevTools与Android 8.1系统WebView的调试协议不匹配导致的——毕竟金丝雀是前沿测试版，兼容性稳定性不如正式版：

• 卸载当前的Chrome金丝雀，安装64.x系列及之前的Chrome正式版，用正式版来调试Cordova WebView，兼容性会靠谱很多。

2. 确认Cordova项目的调试配置是否正确 #

先排查项目本身的调试开关是否开启：

• 打开项目根目录的config.xml，确认添加了以下配置，确保WebView允许调试：

  <preference name="EnableWebViewDebugging" value="true" />
  <preference name="AndroidInsecureFileModeEnabled" value="true" />
  

• 同时检查Pixel设备的开发者选项：确保USB调试和WebView调试开关（部分设备需单独开启）都处于打开状态。

3. 清除Chrome DevTools缓存数据 #

有时候DevTools的旧缓存会引发奇怪的兼容性bug：

• 在Chrome地址栏输入chrome://settings/clearBrowserData
• 切换到「高级」标签，勾选「缓存的图片和文件」「网站设置」，点击清除数据后重启Chrome，再尝试连接调试。

4. 替换系统WebView为Crosswalk（可选方案） #

如果以上方法都无效，可以试试用Crosswalk WebView替代系统默认WebView——它自带独立的Chromium内核，能规避系统WebView与Chrome调试工具的协议冲突：

• 执行命令安装Crosswalk插件：

  cordova plugin add cordova-plugin-crosswalk-webview
  

• 重新构建项目后，再用Chrome调试，大概率能解决空白页和报错问题。

最后验证步骤 #

1. 重启你的Pixel设备和Chrome浏览器
2. 重新USB连接设备，在Chrome的chrome://inspect页面确认设备被正确识别
3. 点击「inspect」后若仍为空白，尝试刷新DevTools页面（快捷键Ctrl+R）

内容的提问来源于stack exchange，提问作者Helmut Heiß