调试 Android 设备网页

Step 1：手机启用开发者模式

需要打开”开发者模式”。如果你的手机已经打开，可以跳过这一步。

开发者模式的打开方法是，进入”设置 > 关于手机”菜单，找到”内部版本号”这一项（或类似名称的条目），在上面连续按七次。退回上一级菜单，应该就能看到”开发者模式”。

进入其中，打开”USB 调试”选项。

Step 2：打开电脑的 Chrome 浏览器，进入”开发者工具”

前提：都要翻墙才能更新安装

1. 检查谷歌浏览器是否最新版本（否，则更新一下，避免因为谷歌浏览器版本太低问题）
2. 点击浏览器右上角三个点，进入设置菜单，检查是否安装chrome developer(否，则安装)

在chrome浏览器下按F12进入开发者工具，点击右侧三个点图标，进入设置菜单，按图寻找到Remote devices远程设备调试工具

Ps：直接在浏览器地址栏输入chrome://inspect 或者about:inspect 也可进入相应工具页面

说明：

1、由于Chrome版本不同，DevTools也可能有些差别。

2、在chome80以上的版本把 "Remote Devices" 面板移除了，实现了chrome://inspect/#devices 提供，因此亲们，要是开发者工具没有寻找到Remote devices远程设备调试工具，直接在浏览器地址栏输入chrome://inspect 或者about:inspect 。

Step 3：连接手机

使用 USB 线将手机和电脑连接起来。手机可能会有弹框，询问是否允许访问手机数据，选择”允许”。

Step 4：打开chrome://inspect

在谷歌浏览器打开chrome://inspect，确保启用 Discover USB devices 复选框。

Step 5：调试网页

安卓手机里面，打开内置浏览器输入想要访问的网址（webview页面），输入以后，单击”打开”，就会在手机浏览器打开这个网址；

或者安卓手机打开你开发的app（如：门店app）中内嵌的webview页面 同时是打开 Chrome://inspect 浏览器。这时，桌面电脑的开发者工具应该会同步显示所有已经打开的 Tab 页。

在开发者工具里面，所有已经打开的 Tab 页，选中想要调试的网页，点击后面的”Inspect”按钮。

这时，就会弹出一个独立的调试窗口。左侧是手机浏览器的预览，右侧是各种调试工具，供开发者使用。

此刻就可以调试了，手机页面改动，对应inspect一栏也是会跟着变动。

要是点inspect出来的独立窗口页面是空白的，则可能第一次的时候需要翻墙，后面就不需要了，也可能出现http的问题（如问题1）

• 问题1：

解决方案：把url地址从原来的http改为https。