今天的网络在手机上的浏览量比在台式机上要多。 由于设备变得非常便携并且屏幕尺寸更小。 因此,如果您正在开发 Web 应用程序,则无法避免对手机(Android 或 iOS)的支持。 移动屏幕上损坏或蹩脚的网站确实会损害您的在线声誉。 手机上的用户体验与桌面完全不同。 所以开发者必须专门设计应用程序来适应手机屏幕。
Google Chrome Dev 提供的工具可让您检查、调试、分析设备上的体验,并且您可以使用本地机器上的 Chrome Dev 工具在移动设备上调试您的应用程序。 在本教程中,我们将学习如何设置本地开发机器以在 Android 上进行远程调试。 我们将通过您的移动设备和本地开发机器之间的 USB 连接进行调试。
您将需要以下内容,以推进远程调试:
- 安装了适用于 Android 28 的 Chrome 的 Android 手机或平板电脑(您可以从 点击此处).
- 用于将您的 Android 设备连接到本地开发机器的 USB 电缆,还要确保您已安装所需的驱动器以将您的 Android 手机连接到计算机。
- 访问 OEM USB 驱动程序列表 并找出适合您的驱动程序。
- Chrome 28+ 安装在您的本地开发机器上。
- 确保在本地开发机器上安装了 ADB Chrome 扩展。 您可以从 点击此处.
在本教程中,我们将在本地开发机器上使用 Sony Xperia L(Android 设备)和 Windows 7。 那么让我们从远程调试开始:
1. 首先确保您的 Android 设备上启用了调试模式
如果您还没有启用,请参考:
- Android 4.2 用户参考: http://www.thesmarthacks.com/2013/04/enabling-usb-debugging-mode-on-android.html.
- 其余可参考: http://www.groovypost.com/howto/mobile/how-to-enable-usb-debugging-android-phone/.
有关设置 Android 设备进行开发的更多信息,请参阅: http://developer.android.com/tools/device.html#setting-up.
2. 连接你的安卓设备
现在使用 USB 电缆将您的 Android 设备连接到您的本地开发机器。 连接Android设备后,您需要在手机上启用USB Web调试,然后在Android上启动Chrome,->设置->开发人员工具->选择启用USB Web调试
选择此选项时,如果它要求您确认与开发机器的连接,请选择“确定”。
3.调试
安装 ADB 扩展程序后,您将在 Chrome 菜单之外看到一个灰色的 Android 图标。 现在单击 Android 图标并选择 -> 启动 ADB。 现在它应该变成绿色,并显示当前连接的设备数量。 然后单击图标并选择 -> 查看检查目标。 这应该会打开一个新选项卡,并会显示已连接的 Android 设备的数量以及它们上当前打开的选项卡。
现在从列表中选择要调试的选项卡。 这将打开一个包含开发人员工具的新窗口。
现在检查页面中的一些元素,该元素会在 Chrome 移动设备中实时突出显示。
通过这种方式,您可以通过从开发工具进行调试来修复特定于设备的错误。 您可以从开发工具执行命令,这些命令将在 Chrome 移动设备中执行。 还可以查看不同的面板,如网络、资源、时间线、配置文件、审核。
现在,您可以修复特定于移动设备的错误,并实时调试移动应用程序,而不是在服务器上部署您的应用程序,然后从您的手机访问它并进行调试。 Google Chrome Dev 提供了这些工具,为开发人员构建设备兼容的应用程序解决了真正的难题。
佩德罗·米格尔·
很高兴了解 Chrome Dev。 为浏览器和移动(iOS 和 Android)开发人员提供的平台日益增加。 感谢您提供有关调试过程的所有详细照片。
米图
这真是令人惊奇且有用的帖子。 从这里,我们可以了解在Android上远程调试Web Apps的清晰过程。 此外,图片以简单明了的方式解释了有关 Chrome Dev 的过程。
范·怀尔德
哇! 安卓摇滚!
不知道这是否可能
斯蒂芬
我认为这对所有 android 用户来说都是非常有用的帖子。 尤其是在那个年代,浏览器的应用程序很多,经常让用户感到困惑。
所有照片都非常详细,易于跟进所有步骤。
感谢您的分享。
斯蒂芬·吴
萨蒂什
确实,这篇文章对在 Android 上调试 Web 应用程序非常有帮助。 还没想好
凯伦戴维森
这是一个信息量很大的帖子。 现在我们可以在 Android 上远程调试 Web 应用程序了。
詹姆斯·史蒂文斯
非常好,内容丰富的帖子。 我一直想知道如何远程调试 Web 应用程序,但我过去阅读的其他博客并不是很简单。 感谢您为我们这些努力遵循技术语言的人提供清晰的术语。
正如斯蒂芬所说,图像非常详细,使说明更容易遵循。
彼得·福特
我一直在寻找一种方法来调试我的三星 Galaxy S3。 我想我来对地方了,因为你的教程真的很有帮助,而且我已经成功地调试了我的设备。 非常感谢您的帮助。
马赫什·斯里瓦斯塔瓦
哇! 我不知道你可以用我的 Android 手机做到这一点。
谢谢!
洗圣
真的很神奇,没想到可以远程调试,专门针对android应用……
爱丽丝
嗨,
谢谢,我终于远程调试了,真的很有帮助。