使用PC远程调试移动端Web页面

目的

只有手机端才能更方便的调试一些特有操作: 如多点触控/弹出输入法, 但手机端又不能很好的使用F12控制台.

我们希望既可以在手机端操作, 也能在PC浏览器控制台查看日志或者审查元素.

设置

1. 一台安卓设备, 打开开发者配置, 打开USB调试, 安装并打开Chrome浏览器.

2. 一台PC, 打开Chrome, 打开科学上网, 进入网址: chrome://inspect/#devices, 打开Discover USB devices.

3. 连接手机和电脑, 手机端会弹出运行USB调试的对话框, 点击允许

4. 稍等片刻, PC端会出现你的手机信息与手机端Chrome打开的所有页面.

   
   
   image.png

5. 选择一个页面点击 inspect 就能开始调试了, 手机端和pc端的操作是同步的.

   
   

疑难杂症

Q: 点击 inspect 之后页面空白或404.
A: 科学上网, 保证 http://appspot.com 能够打开

---

参考

• 移动端Web开发调试之Chrome远程调试(Remote Debugging)