Weinre是一款基于Web Inspector(Webkit)的远程调试工具,借助于网络,可以在PC上直接调试运行在移动设备上的远程页面,中文意思是远程Web检查器,有了Weinre,在PC上可以即时修改目标网页的HTML/CSS/Javascript,调试过程可实时显示移动设备上页面的预览效果,并同步显示设备页面的错误和警告信息,可以查看网络资源的信息,不过weinre不支持断点调试。该项目目前是 Apache Cordova 的一部分。     
     
 
Weinre系统支持性
 
iOS 3.1.3或更低版本不支持
 
webOS 1.45或更早版本不支持
 
Debug客户端支持的平台
 
weinre的Mac程序(自带客户端) - Mac OSX 10.6 64-bit
 
Google Chrome 8及以上版本浏览器
 
Apple Safari 5及以上版本浏览器
 
Debug目标页面支持的平台
 
Android 2.2+系统浏览器
 
Android 2.2+ 中的phonegap
 
iOS 4+ 的safari浏览器
 
BlackBerry v6.x 模拟器
 
webOS
 
chrome8+
 
safari5+
 

一:关于weinre

weinre就是一款依赖于nodejs的远程调试工具

二:weinre的安装

1:安装nodejs以及npm

2:安装weinre:npm -g install weinre

三:weinre的使用例子

1:打开命令行,输入:weinre --boundHost [IP_address] --httpPort [port] (IP_address 是pc的ip地址, 不能是127.0.0.1,port可以输入一个随便的端口:最好是8000以上的)

我的pc的ip地址为10.57.225.53,在终端输入:weinre --boundHost 10.57.225.53 --httpPort 8999

2:在浏览器上打开网址http://10.57.225.53:8999,然后我们就可以看到以下界面:

3:按照标签1

4:按照标签2进入调试界面了

5:利用手机打开所要调试的页面(也就是刚才添加了script的那个页面)

  可以通过sublime的sublimeServer:配置见:http://www.cnblogs.com/lhy-93/p/5741274.html

6:点击调试页面里对应的Targets,然后点击Elements工具,就可以进行调试了。

 
 
 

Weinre(pc调试手机页面)的更多相关文章

  1. 【前端调试手机页面】分享一款便捷的调试工具--spy-debugger

    spy-debugger  :  微信调试,各种WebView样式调试.手机浏览器的页面真机调试.便捷的远程调试手机页面.抓包工具,支持:HTTP/HTTPS,无需USB连接设备. github地址: ...

  2. 使用fiddler4做代理调试手机页面

    由于一般手机不能改host,手机页面如果涉及到各个域名ip的混合使用,在手机上调试看效果非常麻烦. 使用fiddler4做代理,手机跟电脑连到同一个局域网,手机上网通过电脑做个代理上网,那么一切请求就 ...

  3. 通过chrome浏览器调试手机页面(IOS和Android)

    开发PC页面的时候使用chrome浏览器的开发者工具,可以很容易的捕获到页面的dom元素,并且可以修改样式,方便调试,但是手机上却很麻烦,因为手机上没有办法直接打开开发者工具查看元素.其实可以通过将设 ...

  4. 使用weinre调试手机页面

    阅读目录 介绍Weinre 安装Weinre 通过Weinre调试页面 启动target 介绍Weinre Weinre(Web Inspector Remote),是一种远程调试工具.功能与Fire ...

  5. UC浏览器开发者版调试手机页面

    1 关于RI 目前,在手机上使用浏览器访问网页,无法便捷地进行网页语言调试.手机屏幕相对较小且操作不便,直接在手机上进行网页数据调试不太现实. 因此,我们使用技术将手机网页调试信息分离,实现一种能在大 ...

  6. Chrome调试手机页面

    新开发的网页需要在手机或是模拟机上运行测试,如果手头事件比加紧,那么可以借助 Chrome提供的手机网页预览程序进行简单调试.查看 制作的网页是否能够适合各种手机型号使用. 下面所以下如何使用Chro ...

  7. 样式PC和手机页面

    /*媒体查询--当页面大于1200px时*/ @media (min-width: 1200px) { } /*在922和1199像素之间的屏幕里,中等屏幕*/ @media (min-width: ...

  8. APICloud和海马玩模拟器结合调试手机页面

    https://blog.csdn.net/pleasecallme_522/article/details/54577904

  9. 使用weinre远程调试

    1.调试环境: 1)使用nodejs搭建调试服务器: 先安装node,然后使用npm安装weinre,在node.js安装目录输入以下命令 npm install weinre 2)需要wifi环境和 ...

随机推荐

  1. iPhone Screen FAQ

    Q: Why is it a blank window after openning the app and connect mobile device? A: Please make sure th ...

  2. [洛谷P4886]快递员

    题目大意:一个$n$个点的树,树上有$m$个点对$(a,b)$,找到一个点$x$,使得$max(dis(x,a_i)+dis(x,b_i))$最小 如果做过幻想乡的战略游戏这道题,应该这道题的思路一眼 ...

  3. SaltStack日常维护-第七篇

    练习内容 远程执行其他模块 官方模块有很多超过300+ 1.cmd.run 2.network 3.service 4.state 5.其它日常维护 演示 cmd.run模块 可以执行系统命令,超级模 ...

  4. Hue的安装与部署

    Hue的安装与部署 hadoop hue Hue 简介 Hue是一个开源的Apache Hadoop UI系统,最早是由Cloudera Desktop演化而来,由Cloudera贡献给开源社区,它是 ...

  5. 在线前端 样式和js

    bootstrap+ jquery <link rel="stylesheet" href="http://apps.bdimg.com/libs/bootstra ...

  6. 使用httpclient提交表单数据加号(+)会被自动替换成空格的坑

    坑的场景: 今天使用httpclient-4.5.3版本,发送如下报文: { "idNo": "7+6+0+2ce722a546b39463bd62817fe57f8&q ...

  7. centos cgroup配置

    centOS 6:1. 启用cgroup    查看内核是否支持cgroup功能:cat /boot/config-`uname -r` | grep -i rt_group    查看支持的子系统: ...

  8. Spring的注解配置与XML配置之间的比较

    注释配置相对于 XML 配置具有很多的优势: 它可以充分利用 Java 的反射机制获取类结构信息,这些信息可以有效减少配置的工作. 如:使用 JPA 注释配置 ORM 映射时,我们就不需要指定 PO ...

  9. JavaScript权威指南--客户端存储

    客户端存储web应用允许使用浏览器提供的API实现将数据存储在用户电脑上. 客户端存储遵循“同源策略”,因此不同站点的页面是无法读取对于存储的数据.而同一站点的不同的页面之间是可以互相共享存储数据的. ...

  10. 4.彻底理解synchronized

    1. synchronized简介 在学习知识前,我们先来看一个现象: public class SynchronizedDemo implements Runnable {    private s ...