远程调试 Android 设备

从你的 Windows 或 macOS 计算机在 Android 设备上远程调试实时内容。 以下教程页介绍如何:

  • 设置 Android 设备进行远程调试,然后从开发计算机中发现。

  • 在开发设备上检查和调试 Android 设备上的实时内容。

  • 将 Android 设备中的内容截屏到开发计算机上的开发工具实例上。

注意

目前不支持在 iOS 设备上远程调试 Microsoft Edge 应用。 以下指南专门针对 Android 设备上的 Microsoft Edge 进行远程调试。 如果使用的是 macOS 设备,请按照 Brightcove 调试指南使用 Safari 在 iOS 设备上远程调试 Microsoft Edge。 有关 Safari 中的 Web 检查器工具的详细信息,请参阅 Safari Web 开发工具。

步骤 1:发现 Android 设备

下面的工作流适用于大多数用户。 有关更多帮助,请参阅下面的 故障排除:DevTools 未检测到 Android 设备。

  1. 打开 Android 上的“开发人员选项”屏幕。 请参阅 配置设备上的开发人员选项。

  2. 选择 “启用 USB 调试”。

  3. 在开发计算机上,打开 Microsoft Edge。

  4. 在“地址”栏中,转到 edge://inspect。

    Microsoft Edge 中的 edge://inspect 页面

  5. 使用 USB 电缆将 Android 设备直接连接到开发计算机。 首次尝试连接时,将显示有关开发工具检测未知设备的提示。 在 Android 设备上接受“允许 USB 调试”权限提示。

    Android 设备上的“允许 USB 调试”权限提示

  6. 如果显示 Android 设备的型号名称,则 Microsoft Edge 已成功与设备建立连接。 继续第 2 步部分。

故障排除:DevTools 未检测 Android 设备

使用以下提示可帮助你对硬件的正确设置进行故障排除。

  • 如果使用 USB 集线器,尝试将 Android 设备直接连接到开发计算机。
  • 尝试拔下 Android 设备与开发机器之间的 USB 电缆,然后重新插入 USB 电缆。 解锁 Android 和开发计算机屏幕时完成任务。
  • 确保 USB 电缆正常工作。 应该能够在开发计算机上检查 Android 设备上的文件。

使用以下提示可帮助你验证软件是否正确设置。

如果 Android 设备上未显示 “允许 USB 调试 ”提示,请尝试:

  • 开发工具专注于开发计算机并且显示 Android 主屏幕时,断开 USB 电缆连接,然后重新连接。 有时,当 Android 或开发计算机屏幕锁定时,不会显示提示。
  • 更新 Android 设备和开发计算机的显示设置,使其永远不会进入睡眠状态。
  • 将 Android 的 USB 模式设置为 PTP。 请参阅 Galaxy S4 未显示授权 USB 调试对话框。
  • 从 Android 设备上的“开发人员选项”屏幕中选择“撤销 USB 调试授权”,将其重置为全新状态。

如果在插入 Stack Overflow 时发现此页上未提及或 DevTools 设备中未检测到设备 的解决方案,请将解决方案添加到 Stack Overflow 问题。

步骤 2:从开发计算机调试 Android 设备上的内容

  1. 在 Android 设备上打开 Microsoft Edge。

  2. 转到 edge://inspect。 将显示 Android 设备的型号名称,后跟设备序列号。 在下面,应显示设备上运行的 Microsoft Edge 版本,括号中会显示版本号。 每个打开的 Microsoft Edge 选项卡获取一个唯一部分。 可以从分区与该选项卡交互。

连接的远程设备

  1. 在 “打开带有 URL 的选项卡” 文本框中,输入 URL,然后单击“ 打开”。 该页面将在 Android 设备上的新选项卡中打开。

  2. 单击刚刚打开的 URL 旁边的“ 检查 ”。 新的开发工具实例打开。

更多操作:聚焦、刷新或关闭选项卡

选择要焦点、刷新或关闭的选项卡旁边的焦点选项卡、重新加载或关闭。

用于聚焦、刷新或关闭选项卡的按钮

检查元素

转到 DevTools 实例的 “元素” 工具,将鼠标悬停在某个元素上以在 Android 设备的视区中突出显示它。

还可以在 Android 设备屏幕上点击某个元素,以在 “元素 ”工具中选择它。 在 DevTools 实例上单击“ 选择元素 (选择元素 ”) 图标,然后在 Android 设备屏幕上选择元素。

选择元素 在第一次选择后被禁用,因此每次想要使用此功能时都需要重新启用它。

将 Android 屏幕截屏到开发计算机

单击 “切换截屏 (切换截屏) 图标以查看 DevTools 实例中 Android 设备的内容。

可以通过多种方式与截屏视频交互:

  • 单击将转换为点击,在设备上触发适当的触摸事件。
  • 计算机上的击键会发送到设备。
  • 若要模拟收缩手势,请在拖动时按住 Shift 。
  • 如果要滚动,请使用触控板或鼠标滚轮,或使用鼠标指针拖动。

使用以下提示来帮助你进行截屏:

  • 截屏视频仅显示页面内容。 截屏视频的透明部分表示设备接口,例如Microsoft边缘地址栏、Android 状态栏或 Android 键盘。
  • 截屏视频会对帧速率产生负面影响。 在测量滚动或动画时禁用截屏视频,以更准确地了解页面性能。
  • 如果 Android 设备屏幕锁定,截屏视频的内容将消失。 解锁 Android 设备屏幕以自动恢复截屏视频。

注意

此页面的某些部分是根据 Google 创建和共享的作品所做的修改,并根据 Creative Commons Attribution 4.0 International License 中描述的条款使用。 原始页面 在此处 找到,由凯斯·巴斯克创作。

Creative Commons 许可证 此作品根据 Creative Commons 署名 4.0 国际许可获得许可。