美文网首页
使用chrome浏览器真机调试H5

使用chrome浏览器真机调试H5

作者: 云翼飞 | 来源:发表于2019-12-09 21:33 被阅读0次

    使用chrome浏览器真机调试H5

    开始远程调试之前,需要做好如下准备:

    • 在你电脑上安装Chrome 32 或者更新的版本
    • 一根连接Android设备的USB线
    • 手机系统是Android 4.0+ 并且在手机上安装Android版本的Chrome浏览器。

    重要:pc端的浏览器版本要比移动端的浏览器版本低

    Remote browser is newer than client browser. Try `inspect fallback` if inspection fails.
    

    远程浏览器(手机端)比客户机(pc端)浏览器更新。如果检查失败,尝试“检查备份”。

    不然的话出不来inspect fallback这个按钮,使用inspect 会报错http/ 1.1 404 not found

    image.pngimage.png
    设置Android手机参考地址: https://jingyan.baidu.com/article/5552ef47b11479518ffbc92e.html
    在Android手机上选择 设置>开发人员工具>USB调试,然后会弹出一个提示框“是否允许USB调试”,选择 **
    连接并且发现手机
    用USB线连接手机和电脑,然后在chrome浏览器中去找到手机。
    usb连接方式选择:传输文件或者MIDI(这两个都试试,不太确定是哪个)
    image.pngimage.png image.pngimage.png
    在电脑上的chrome浏览器中,导航到
    chrome://inspect**,确认 Discover USB devices 是选中状态,并且可以看到已经发现我的COL-AL10:
    Prot forwarding 设置本地地址和端口号
    image.pngimage.png
    image.pngimage.png
    在chrome上准备好调试网站

    将要调试的网页链接打开


    image.pngimage.png

    在弹出的窗口就可以远程调试手机上面的效果,调试的过程中保持手机屏幕始终不要关闭。


    image.pngimage.png 接下来就可以像调试pc端一样调试手机端了

    相关文章

      网友评论

          本文标题:使用chrome浏览器真机调试H5

          本文链接:https://www.haomeiwen.com/subject/liiigctx.html