远程调试 Android 设备网页
网页在手机浏览器打开时，怎么调试？安卓设备的 Chrome 浏览器支持远程调试，可以使用桌面浏览器的开发者工具。本文介绍如何进行远程调试。
https://www.wangbase.com/blogimg/asset/201906/bg2019062613.jpg
Step 1：启用开发者模式
远程调试需要打开”开发者模式”。如果你的手机已经打开，可以跳过这一步。
开发者模式的打开方法是，进入”设置 > 关于手机”菜单，找到”内部版本号”这一项（或类似名称的条目），在上面连续按七次。退回上一级菜单，应该就能看到”开发者模式”。
进入其中，打开”USB 调试”选项。
https://www.wangbase.com/blogimg/asset/201906/bg2019062605.jpg
Step 2：连接手机
使用 USB 线将手机和电脑连接起来。手机可能会有弹框，询问是否允许访问手机数据，选择”允许”。
https://www.wangbase.com/blogimg/asset/201906/bg2019062606.jpg
打开电脑的 Chrome 浏览器，进入”开发者工具”。点击右上角三个点，进入设置菜单，打开”更多工具 / 远程设备”窗口。
https://www.wangbase.com/blogimg/asset/201906/bg2019062607.jpg
选中 “Discover USB devices” 选项。
https://www.wangbase.com/blogimg/asset/201906/bg2019062614.jpg
这时应该可以看到手机已经连接成功了。
https://www.wangbase.com/blogimg/asset/201906/bg2019062608.jpg
Step 3：调试网页
安卓手机里面，打开 Chrome 浏览器。这时，桌面电脑的开发者工具应该会同步显示所有已经打开的 Tab 页。
并且，开发者工具还有一个输入框，让你输入想要访问的网址。输入以后，单击”打开”，就会在手机浏览器打开这个网址。
https://www.wangbase.com/blogimg/asset/201906/bg2019062609.jpg
在开发者工具里面，所有已经打开的 Tab 页，选中想要调试的网页，点击后面的”Inspect”按钮。
https://www.wangbase.com/blogimg/asset/201906/bg2019062610.jpg
这时，就会弹出一个独立的调试窗口。左侧是手机浏览器的预览，右侧是各种调试工具，供开发者使用。
https://www.wangbase.com/blogimg/asset/201906/bg2019062611.jpg
“Inspect”按钮旁边的”更多选项”，还提供了重载、关闭等操作。
https://www.wangbase.com/blogimg/asset/201906/bg2019062612.jpg
参考链接
[*]Debugging your website from Android Devices,Tapas Adhikary
[*]Get Started with Remote Debugging Android Devices, Kayce Basques
（完）
页:
[1]