如何在电脑上远程调试手机中的页面

1、用chrome浏览器远程调试安卓手机上的页面

• 1）Chrome浏览器远程调试只能调试安卓手机，毕竟Chrome和安卓都是谷歌的（貌似有其他方式可以调试iphone但比较麻烦，目前我还不太清楚）
• 2）电脑和手机分别安装Chrome浏览器（版本尽量是最新版，不是最新也要接近最新版本）
• 3）把你的安卓手机开启usb调试模式，这个不同手机开启方式可能不一样，具体网上查查你的手机怎么开启就行
• 4）如果是windows电脑，请安装你手机对应的电脑驱动程序
• 5）电脑Chrome浏览器打开这个地址：chrome://inspect/#devices
• 6）把手机用usb线连接上电脑，选择usb debug模式连接，这个一般连接的时候会弹出来让你选择，不同手机有可能有点不一样，比如我的魅蓝S6，就要选择『内置光盘』
  
  而小米3则是选择文件传输（选择以后就会自动问你是否同意使用usb调试之类的）：
  

• 7）打开手机Chrome浏览器，并打开你要调试的页面，如果一切正常，你将看到类似下图所示的界面：
  魅蓝S6:
  
  小米3：
  

点击inspect，即可开始调试：

如果电脑上的Chrome浏览器没有出现手机上的页面，请检查：

• 电脑是否正确安装了手机驱动（如果正确安装是否考虑重启电脑试试）？
• 手机是否开启了USB调试模式？
• 手机连接USB的时候是否使用了usb调试模式？（有时候很奇怪，插上线手机就是不提示问你是否使用usb调试模式，我遇到的情况是重启手机就好了）
  如果是Windows系统，这篇文章会更详细一点：移动前端页面与Chrome的远程真机调试
  另外这里还有一篇高级使用文章：Chrome 调试工具的一些高阶功能
  

2、用Safari浏览器远程调试iPhone上的页面

• 1）因为Safari浏览器是苹果的，所以目前我这里测试的是用苹果电脑(即Mac)的Safari浏览器调试iPhone的Safari浏览器
• 2）Mac的safari浏览器开启显示开发者工具选项：偏好设置→高级
  
• 3）把你的iPhone用数据线连接到Mac上
• 4）Mac和iPhone都打开Safari浏览器，iPhone浏览器上打开你要调试的网页
• 5）在Mac的Safari按下图操作即可调试iPhone的Safari浏览器上的网页