Weinre(WebInspector Remote)是 一款基于Web Inspector(Webkit)的远程调试工具,借助于网络,可以在PC上直接调试运行在移动设备上的远程页面,中文意思是远程Web检查器,有了 Weinre,在PC上可以即时修改目标网页的HTML/CSS/Javascript,调试过程可实时显示移动设备上页面的预览效果,并同步显示设备页 面的错误和警告信息,可以查看网络资源的信息,不过weinre不支持断点调试。该项目目前是 Apache Cordova 的一部分。
weinre工作原理
两张图读懂Weinre的工作机制:
上述三层结构示意图的含义:
Debug客户端(client):本地的WebInspector,远程调试客户端。
Debug服务端(agent):本地的HTTPServer,为Debug目标页面与Debug客户端建立通信。
Debug目标页面(target):被调试的页面,页面已嵌入weinre的远程js。
客户端、目标页面与Debug服务端之间使用XMLHttpRequest (XHR)进行HTTP通信,你通常的使用情形是将Debug客户端与服务端搭建在桌面开发环境,Debug目标页面放在移动设备。
由于Weinre的debug客户端是基于Web Inspector开发,而Web Inspector只兼容WebKit核心的浏览器,所以只能在Chrome/Safari浏览器打开Weinre客户端进行调试。
我在Chrome 38/39版本测试时打开Debug客户端出现页面白板,原因未知,了解原因的欢迎留言给我。换为Safari浏览器打开则正常。
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的Java版本下载地址无法访问的问题,借用skyhh同学的话,是由于weinre被PhoneGap收购,PhoneGap又
被Adobe收购,Adobe收购PhoneGap后,把PhoneGap捐给了Apache,Apache把PhoneGap放在Cordova的项目
中。Weinre也从最初的Java移植到了当前的JavaScript。在GitHub上搜索weinre的结果中前两个就是官方的Weinre项目。
先说第二个项目,是Apache后来推出的JavaScript版本weinre,需要在nodejs环境下安装使用,使用npm包管理工具也可以直接下载安装。
安装与服务启动命令如下:
机器上有nodejs开发环境的同学到此即配置完毕,没有nodejs环境的继续往下看。
如果您觉得本文的内容对您的学习有所帮助:
关键字:
jquery