手机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:172.19.17.62
$ ipconfig getifaddr en0

开启本地监听服务器:
weinre --boundHost 172.19.17.62

打开http://172.19.17.62:8080 ,

将这段脚本放在需要调试的手机页面中就可以远程调试了,

加载好之后就可以在remote tab下找到需要调试的页面了, 和chrome devTools类似, 也可以查看DOM元素和控制台等。

手机H5 web调试利器——WEINRE (WEb INspector REmote)的更多相关文章

  1. web调试利器_fiddler

    此文已由作者夏君授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 一.fiddler简介 直接引用官网介绍 The free web debugging proxy for a ...

  2. 移动端H5测试调试利器 chrome://inspect/#devices

    使用 chrome://inspect/#devices,可以使安卓手机里的WebView也能和chrome一样审查元素,调试和测试移动端H5页面. 我使用的是三星S6 (该功能支持安卓系统4.4及以 ...

  3. Web调试利器fiddler介绍

    转载:http://blog.chinaunix.net/uid-27105712-id-3738821.html 最近在使用fiddler,发现这个真是非常最犀利的web调试工具,笔者这里强烈推荐给 ...

  4. Web调试利器OpenWindow

    有些时候调试web页面,在循环里面我们不方便设置断点进行调试,或者调试起来比较麻烦,我们就可以用openWindow的方法打印出想要查看的信息,既方便又省时. 代码如下: OpenWindow = w ...

  5. Web调试利器fiddler使用

    fiddler官网:http://fiddler2.com/ http://wenku.baidu.com/view/053e79d776a20029bd642dc1 http://www.cnblo ...

  6. Web调试利器fiddler(转)

    http://blog.chinaunix.net/uid-27105712-id-3738821.html

  7. 手机前端开发调试利器 – vConsole

    我们在开发手机版网页的时候,常常会出现下面的情景: (1) 开发时,在自己电脑上运行得好好的,在手机上打开就挂了,但是手机上又看不到error log: (2) 上线后,某用户表示页面失灵,但我们自己 ...

  8. 手机前端开发调试利器-vConsole

    最近因为做抽奖页面,在android上可以使用手机连上电脑后用chrome浏览器chrome://inspect进行页面探测,但是ios中的页面就不能这样探测 在网上搜索后发现此插件,大大解决了问题 ...

  9. Fiddler(Web/HTTP调试利器)

    简述 Fiddler是一个http协议调试代理工具,它能够记录并检查所有你的电脑和互联网之间的http通讯,设置断点,查看所有的"进出"Fiddler的数据(指cookie.htm ...

随机推荐

  1. 获取 input 单选框和多选框的值

    引用  jQuery的js <script> $(function(){ var arr = new Array(); $('#checkbox').click(function(){ a ...

  2. CSS()方法设置元素样式

    使用CSS()方法可以直接设置元素的样式,方法为:css(name,value) $(p).css("font-weight", "bold");     // ...

  3. visio形状内文本的换行符

    & Chr() &Shape sp;sp.Characters = "12345" & Chr(10) & "56789"; 注 ...

  4. c#Winform控件总结

    1. C# WinForm控件.自定义控件整理(大全) (http://www.cnblogs.com/top5/archive/2010/04/29/1724039.html) 2. c#窗体控件用 ...

  5. javascript动态添加本地文件列表信息

    工作需要做了一个动态添加列表页面的小demo.用到了杂七杂八的javascript小知识. 而且并没有涉及到工作中的具体情境.有些通用,所以暂且罗列到这里.以后需要的时候可以直接拿来用. 看源码总是让 ...

  6. js获取当前页面信息

    设置或获取对象指定的文件名或路径.<script>alert(window.location.pathname)</script> 设置或获取整个 URL 为字符串.<s ...

  7. expdp小记

    一.10.2.0.5要求expdp导出a用户b表空间下的数据. expdp \'/ as sysdba\' directory=mydir dumpfile=1.dmp schemas=a exclu ...

  8. 电梯多媒体WinForm项目Q&A总结

    最近,我给一家公司做了个电梯多媒体软件,该软件使用C#编写,现在我将其中遇到的问题及其解决方法总结一下,以便下次再遇到同样的问题可以快速解决:同时,也给博友分享一下,共同学习,共同提高. 1.Ques ...

  9. rm: Argument list too long

    rm -rf  /testdir/* -bash: /bin/rm: Argument list too long 解决: cd /testdir/; ls | xargs rm -rf

  10. listView获取item的Edit内容,listView中的edit内容在滚动时自动赋值了前面的内容

    Today I am going to explain how to create a ListView with EditText and why will we need a TextWatche ...