开发人员控制台

调试您的网页应用


调试您的网页应用

您可以在开发计算机上使用Chrome DevTools来调试在Fire TV设备、Fire平板电脑或其他Android设备上运行的网页应用。

使用USB数据线或WiFi网络连接开发计算机和主机设备。

先决条件

安装Chrome DevTools

要使用Chrome DevTools调试您的网页应用,您必须首先在计算机上安装Chrome浏览器(版本32或更高版本)。如需下载说明,请访问http://www.google.com/chrome

Chrome DevTools使用Android调试桥(adb)(Android开发工具包工具的一部分)从您的计算机与网页应用进行通信。有关使用Chrome DevTools的更多信息,请参阅Chromium博客上的发现Chrome DevTools

在您的开发计算机上,打开Chrome。您应该使用您的某一Google账户登录Chrome。远程调试在匿名模式或来宾模式下不工作。

使用USB设置调试环境

请按照以下这些步骤将开发计算机上的Chrome DevTools连接到主机设备上的网页应用测试器:

  1. 使用USB数据线将主机设备直接连接到开发计算机。请勿使用任何中间USB集线器。
  2. 网页应用测试器中,单击测试以启动应用。
  3. 在您的开发计算机上,在URL输入行中输入chrome://inspect。Chrome浏览器将显示主机设备和正在运行的应用。单击inspect(检查)以打开开发者工具窗口。

现在,您可使用Chrome DevTools的功能来调试和测试您的网页应用。

使用WiFi设置调试环境

要通过无线方式连接Chrome DevTools和网页应用以进行调试,请执行以下操作:

  1. 使用USB数据线将主机设备直接连接到开发计算机。
  2. 在主机设备上,点击并打开网页应用测试器
  3. 在您的计算机上,打开命令提示符窗口或终端Shell,然后导航到Android开发工具包platform-tools目录。
  4. 运行以下命令:

    在Windows上

    adb tcpip 5555
    

    在OS X上

    ./adb tcpip 5555
    
  5. 断开主机设备与计算机的连接。
  6. 确保您的开发计算机和设备连接到同一网络。
  7. 通过运行以下命令连接到您的设备,并在网页应用测试器中使用此处指定的IP地址:

    在Windows上

    adb connect 192.168.1.133
    

    在Mac OS X上

    ./adb connect 192.168.1.133
    
  8. 在您的开发计算机上,在URL输入行中输入chrome://inspect。Chrome浏览器将显示主机设备和正在运行的应用。单击inspect(检查)以打开开发者工具窗口。

随后,Chrome DevTools将打开一个Chrome窗口,您可以在其中查看网页应用的代码并在运行时进行调试。

在第一代Kindle Fire上设置调试环境

Chrome DevTools在不兼容Chromium的Android设备(包括第一代Kindle Fire)上不可用。对于这些设备,JavaScript控制台通过WiFi提供有限的调试功能。它允许您将JavaScript命令发送到设备。您必须先设置网页应用测试器,然后才能连接到JavaScript控制台。请参阅Amazon Web App Tester以了解更多信息。要在不支持Chrome DevTools的设备上设置调试环境,请执行以下操作:

  1. 在您的设备上点击并打开网页应用测试器应用。
  2. 使用屏幕底部的全屏手柄打开状态栏。仅在Fire平板电脑上才有必要执行此步骤。
  3. 从屏幕顶部,在状态栏上向下轻扫以打开“Quick Settings(快速设置)”。您会收到一个启用JavaScript控制台的通知。
  4. 点击通知以启用JavaScript控制台。将显示一个新的通知,其中包含访问计算机上的JavaScript控制台的URL。
  5. 在计算机上,确保您与设备连接到同一网络。打开浏览器并输入上一步中指定的URL。