安卓手机联调Chrome调试H5页面

欢迎访问我的博客https://qqqww.com/,祝码农同胞们早日走上人生巅峰,迎娶白富美~~~

文章目录

    • 1 前言
    • 2 debugx5.qq.com
    • 3 手机连接电脑并打开开发者选项和USB调试
    • 4 Chrome设置
    • 5 参考文章

1 前言

由于最近调试H5,客户那边只有一个链接,得想办法重现bug并且还要能调试,就用了这个方法,而且因为有点忙,此文档只做记录,所以没有配很详细的图,有原始参考文章在下面我会贴出链接,或者还有疑问的可以直接评论或者联系我

2 debugx5.qq.com

打开微信任意一个聊天界面,输入"debugx5.qq.com",发送,点击已经发送出去的这条消息,可以进入到"X5 调试页面,反正从手机微信进入这个调试页面就对了

勾选"打开TBS内核Inspector调试功能"和"打开TBS内核X5jscore Inspector调试功能"

这个我参考的文章里面写的不详细,应该是勾选了TBS内核Inspector调试功能和TBS内核X5jscore Inspector调试功能之后,还需要进入菜单栏的渲染,往下翻,有个目标网址,默认的是baidu.com,给填上你需要调试的H5页面的URL,记得一定要加协议,就是http或者https这些东西,不然打不开

3 手机连接电脑并打开开发者选项和USB调试

这里相信大部分开发者都会吧,原文上让用什么adb devies指令检测是否连接到电脑上,如果这样的话就还需要去搭建一个Android环境,所以没必要,简单粗暴,刷机精灵之类的工具,连接上去,就是我们以前刷机那一套,至于怎么打开开发者选项和USB调试,网上答案不计其数

4 Chrome设置

在浏览器地址栏中输"chrome://inspect/#devices”

打开该页面出现你的手机信息就OK了

这个时候点击页面上基本都在最后一行有一个x5页面下面有一个inspect

5 参考文章

  • 用Chrome调试微信h5页面

你可能感兴趣的:(HTML)