手机H5 web调试利器——WEINRE (WEb INspector REmote) 安卓手机
调试移动端页面,优先选择使用chrome浏览器调试,如果是hybrid形式的页面,可以使用chrome提供的chrome://inspect/#devices 安卓真机调试,不过这个要求比较高:
首先,你的 Chrome 版本必须高于 32
其次你的测试机 Android 系统高于 4.0,
再其次,测试机安装 Chrome for Android 才可以使用 Chrome 远程调试这项功能,
最后, 手机需要开启USB调试模式
比如需要调试嵌入在APP中webView中的页面, 恰好安卓的版本比较低,没办法真机调试,
这时候weinre就是最好的选择。
如何使用 weinre
WEINRE 是 WEb INspector REmote 的缩写, 可以远程调试web页面。
安装
$ sudo npm install -g weinre
$ weinre -v
配置
获取本机IP:192.168.0.199
$ ipconfig getifaddr en0
开启本地监听服务器:
weinre –boundHost 192.168.0.199
浏览器打开 192.168.0.199:8080
效果如下
将这段脚本放在需要调试的手机页面中就可以远程调试了,
加载好之后就可以在remote tab下找到需要调试的页面了, 和chrome devTools类似, 也可以查看DOM元素和控制台等。
点击elements 查看相应的元素,并修改,即时生效
原帖子地址 https://www.cnblogs.com/fanyo…
原文地址:https://segmentfault.com/a/1190000018258220
相关推荐
-
h5 与原生 app 交互的原理 html5
2018-10-22
-
HTML5 — 浏览器数据缓存 — indexedDB html5
2019-10-8
-
HTML5 & CSS3 初学者指南(4) – Canvas使用 html5
2020-6-22
-
H5与企业微信jssdk集成 html5
2019-9-15
-
前端骨架屏方案小结 html5
2018-10-30
-
小技巧|H5禁止手机虚拟键盘弹出 html5
2018-7-2
-
HTML5新增的表单验证功能 html5
2019-10-9
-
使用HTML5 FormData对象实现大文件分块上传(断点上传)功能 html5
2019-10-9
-
H5移动端开发 html5
2018-8-19
-
一张图概括 __proto__, prototype, constructor 的关系 html5
2019-10-30