Weinre(pc调试手机页面)

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工具，就可以进行调试了。

时间： 2024-10-14 19:45:22

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

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

开发PC页面的时候使用chrome浏览器的开发者工具,可以很容易的捕获到页面的dom元素,并且可以修改样式,方便调试,但是手机上却很麻烦,因为手机上没有办法直接打开开发者工具查看元素.其实可以通过将设备连接到PC,使用PC的开发者工具检测 一.针对android设备 1.在android设备上开始开发者模式 2.将设备连接到PC,在chrome浏览器地址栏输入:chrome://inspect/#devices 3.在手机上打开网页的时候,chrome就会检测到网页,可以直接调试 二.针对IOS

Chrome调试手机页面

新开发的网页需要在手机或是模拟机上运行测试,如果手头事件比加紧,那么可以借助 Chrome提供的手机网页预览程序进行简单调试.查看 制作的网页是否能够适合各种手机型号使用. 下面所以下如何使用Chrome调试多类型手机网页. 首先 下载Chrome 浏览器. 在你要调试的网页或是本地页面中.按F12 打开调试器. 工具/原料 Chrome浏览器 方法/步骤 打开 仿真面板.如图所示: 可以在 Device 选择设备. 可以在Screen  设置模拟的屏幕方面的东西,设置分辨率,屏幕尺寸. 可以在

使用weinre调试手机页面

Weinre(Web Inspector Remote),是一种远程调试工具.功能与Firebug及chrome调试器类似,可以帮助我们即时更改页面元素.样式,调试JS等. 工作原理 weinre由三部分组成 1. debug server 核心组件,运行在服务端,负责与另外两部分通信. 2.debug client webkit核浏览器,与debug server通信.展现调试界面,允许你修改dom,查看网络信息等. 3. debug target.  待调试的页面.你需要在页面中嵌入一小段j

使用weinre远程调试手机网页（nodejs、phoneGap）

本调试方式需要wifi环境和webkit浏览器. weiner主页:http://people.apache.org/~pmuellr/weinre/docs/latest/Home.html 一.配置调试服务器 (一).nodejs搭建调试服务器(以windows为例)1.安装node.js安装程序下载:http://nodejs.org/#download本文安装在“F:/nodejs/”目录. 2.测试安装是否成功打开CMD,切换到nodejs所在的安装目录.输入如下命令测试node.js

用电脑调试手机页面

Weinre(WEb INspector REmote)是一个页面调试工具,主要用于远程调试.对于调试手机设备上的页面来说,Weinre是非常有用的. 我们需要一些步骤让Weinre运行起来,首先我们需要安装node.js,Weinre将会运行在node.js上,下一步我们将会安装 node package manager(npm),最后,我们将会安装Weinre. 第一步: 为了得到node.js,最简单的方式是下载windows installer.因为windows installer已经

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

1 关于RI 目前,在手机上使用浏览器访问网页,无法便捷地进行网页语言调试.手机屏幕相对较小且操作不便,直接在手机上进行网页数据调试不太现实. 因此,我们使用技术将手机网页调试信息分离,实现一种能在大屏幕.高配置PC上来调试小屏幕.低配置的手机浏览器访问的网页的开发工具——RemoteInspector(简称RI). 1.1主要功能 Android平台UC浏览器开发者版,主要支持以下功能: DOM查看和修改 JavaScript调试.CSS调试 网络状态查看 资源文件查看 Console控制台

利用firefox远程调试手机页面

在pc端的Firefox中添加插件ADB Helper https://github.com/mozilla/adbhelper 手机用数据线与pc连接 点击“地球” 选择自己的设备这时会请求手机需要手机同意远程 选择自己要查看的目的页面

使用Fiddler调试手机页面请求

从事前端开发的同学一定对Fiddler不陌生,它是一个非常强大的http(s)协议分析工具,如果你不知道它是什么,可以自行google一下,本文不再作科普,简单的说它可以代替Chrome开发人员工具中Network面板或Firefox的HttpWatch插件的功能. 我们知道如何在电脑上调试页面请求,但在手机端你没有这么多强大好用的调试工具来调试你的webapp,如果你需要查看在手机上打开页面时,所产生的http请求却又不知道怎么做,那就继续往下看.(当然,大部分情况下,你可以直接在电脑上用Ch

电脑谷歌浏览器调试手机页面

Android:1. 手机打开开发者模式,允许usb调试2. 手机连接电脑后,电脑打开chrome,然后输入 chrome://inspect/#devices,可以看到连接设备. 3. 点击inspect就可以调试.Ipad:1. 在ipad设置->safari->advanced,打开web inspector2. ipad连接mac book后,mac打开safari->开发,下面可以看到连接设备.然后就可以调试了.