美文网首页
H5在安卓端的调试方案

H5在安卓端的调试方案

作者: 詹小云 | 来源:发表于2019-09-30 10:31 被阅读0次

    很多时候,h5可以直接在浏览器上直接进行开发、调试,但是真机上的表现并一定都会按你开发时的预想走。所以既能让页面在真机上运行,又能在浏览器上进行调试(log、断点等),那可真是一件极舒服的事。
    要做到这样,并不难,只要跟着我的步骤走。

    真机方面

    1. 确保你的机子处于开发者模式,并允许USB调试。关于如何打开开发者模式,每个机型都不一样,所以具体型号查百度就可以了。
    2. 用USB将你的机子和电脑连在一起,这时会弹出USB进行充电、文件传输等几个选项。请务必选择文件传输

    浏览器方面

    1. 只能选择chrome
    2. 输入网址:chrome://inspect/#devices
    3. 稍等片刻,就会显示出你此时在真机上打开的H5页面网址。点击inspect,就能打开调试页面了。你在手机上做的任何行为都会在chrome上同步,非常nice。

    页面空白

    按照了上面的步骤执行,但是出现的页面却是空白的。有几个解决方案可尝试:

    1. 翻墙
      因为chrome inspect需要加载 https://chrome-devtools-frontend.appspot.com 上的资源,所以需要翻墙。
    2. 更新chrome版本
      webview内置的内核版本若是高于PC端的chrome也会导致空白
    3. 清缓存
      chrome://appcache-internals/#清除这里的缓存

    相关文章

      网友评论

          本文标题:H5在安卓端的调试方案

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