360安全浏览器使用Remote Debugging远程调试手机端

一般在电脑端，需要调试网站的一些样式，js代码之类的，只需要F12（审查元素）即可打开开发者工具了，而且在这上面可以很轻松的看到调试的结果，所以由此就想到手机端是不是也可以这么轻松的调试，尽管之前有看过这方面的文章，但是并没有的真正的去实际操作一番，好在调试顺利，随即写下文章记录下。

在开始之前也通过搜索引擎看了很多大佬的文章，但是都没有是在360安全浏览器的环境下调试的，我就在想都是用的谷歌内核的浏览器应该是可以的吧，事实证明我是对的。

一、调试前准备工具

1、电脑端——360安全浏览器（版本号12.1.2452.0），写上版本号的原因是，之前有出现过不同的版本之前是有一定的差异性的，所以就给放上的，也就是说如果没成功，可以试试在相同的坏境下是否能成功。

2、手机端——谷歌浏览器一枚（我在酷安APP下的）

3、手机一部

4、手机USB数据库一条

二、打开手机的开发人员选项

不同的手机，开发者选项打开方式有一定的差异性，不懂得朋友可以直接百度搜索【xx手机xx型号怎么打开开发人员选项】一般都是可以快速解决这个步骤，我就以华为手机为例：设置——系统——关于手机——连续点击版本号。

三、打开手机的USB调试模式

在二的基础之上，才可以打开USB调试模式，我的是在设置——系统——开发人员选项，然后按下图勾选。（小编就是因为这步没勾选对花了好多时间，排除问题，所以大家要注意了！）

四、开始调试

1、手机通过usb数据线连接到电脑，这步的话有的朋友会出现usb设备无法识别的情况，这里我建议大家统一使用相关的电脑版手机助手（我是360手机助手）帮你安装好驱动，好处就是使用手机助手，会自动识别你的机型，然后自动安装驱动，反正就是各种自动化操作，你只要保证usb数据线连接正常。

2、打开360安全浏览器网址栏输入：【chrome://inspect】，勾选【Discover USB devices】我这边默认就是勾选的，没有的朋友记得勾选，如果在上面的步骤都是正确的话，这时候手机会弹出下方右边图，记得允许就可以了。

3、识别到手机设备后，记得一定要在手机端打开谷歌浏览器APP浏览你要调试的网站，才能在【Remote Target】下面有相应的浏览的记录，这时候就可以对网站进行调试分析了，一般的点击【inspect】，不过好像是因为我的版本的问题，我需要点击【inspect fallback】才能进行调试。

总结

之前使用的调试方法都是用F12的审查元素，来模式手机端调试的，但是实际在真机上效果不显示或者有一定的差异性，而用该方法调试就可以避免这种问题。这里还有个小提醒，如果想在UC浏览器上调试的话，就要下载对应的UC浏览器开发版。