如何使用Google Chrome调试设备上的Cordova应用

本文概述

  • 要求
  • 设置调试
  • 1.在Android中启用开发人员模式
  • 2.在Google chrome桌面中设置检查模式
  • 3.开始调试
  • 重要笔记
尽管使用Android Studio(本机android应用程序)对android应用程序进行调试非常容易, 但是如果你使用的工具不正确, 则在cordova应用程序上进行调试可能会成为一个噩梦。你会发现在代码上进行了一些修复, 编译, 在设备上进行检查, 再次检查了代码, 再次进行了编译, 发现相同的错误无济于事。
要调试Cordova应用程序, 我们将使用Chrome调试工具, 该工具可在Google Chrome(桌面版)中使用。
注意 这种方法也可以在Google Chrome浏览器中调试普通网站。
要求
  • 耐心(在某些台式机中, 设置此过程可能需要更长的时间)
  • Android设备(Android> = 4.4)和USB电缆
  • 谷歌浏览器(> = v.30)
  • 更耐心
设置调试 该过程包括3个步骤:
  1. 在Android设备上启用开发者模式
  2. 在Google chrome桌面中设置检查模式
  3. 开始调试
1.在Android中启用开发人员模式 为了能够使用计算机调试Android设备, 必须首先在设备中启用USB调试。默认情况下, 此选项是隐藏的, 我们需要使其可见, 请转到Android设置> 关于手机(最后一个选项)。
首先在内部版本号上点击7次(也是最后一个选项), 然后出现一条消息” 你现在是开发人员” 。然后, 返回到设置, 你现在将在菜单中看到一个新的可用选项。
如何使用Google Chrome调试设备上的Cordova应用

文章图片
点击此按钮, 然后转到最后一个选项(连接USB时, 调试:USB调试模式)。
如何使用Google Chrome调试设备上的Cordova应用

文章图片
现在, 你将能够在chrome上调试cordova应用程序。
2.在Google chrome桌面中设置检查模式 现在你可以在设备中进行调试了, 将手机连接到桌面。在设备上, 警报将提示你允许从计算机进行USB调试, 请点击” 确定” 。
然后在Google chrome上浏览至以下网址:
chrome://inspect

如果一切正常, 你将获得以下图像:
如何使用Google Chrome调试设备上的Cordova应用

文章图片
单击你要调试的应用程序并在设备上处于活动状态的应用程序检查, 然后像在Web项目上一样进行检查。
3.开始调试 最后, 以与在浏览器中处理Web应用程序相同的方式无限制地调试应用程序。
重要笔记 某些设备需要在桌面上安装适当的驱动程序(例如, 如果你有Motorola, 则需要为桌面下载Motorola的驱动程序, 然后一切正常。)
如果你已经安装了驱动程序, 并且chrome:// inspect仍未显示任何设备, 则说明ADB守护程序未启动。要启动Android调试桥, 请打开一个新终端, 并使用cd命令切换到Android的SDK目录, 尤其是进入platform-tools文件夹:
cd C:\Users\sdkca\AppData\Local\Android\sdk\platform-tools

并执行以下命令:
adb devices

那应该列出控制台中所有已连接的设备:
如何使用Google Chrome调试设备上的Cordova应用

文章图片
【如何使用Google Chrome调试设备上的Cordova应用】在控制台中列出设备后, 它们现在应该在chrome:// inspect中列出。

    推荐阅读