Weinre(pc调试手机页面)

时间:2022-09-07 15:53:14

     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以上的)

Weinre(pc调试手机页面)

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

Weinre(pc调试手机页面)

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

Weinre(pc调试手机页面)

3:按照标签1

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

Weinre(pc调试手机页面)

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. 让Chrome 接管邮件连接,收发邮件更方便了

    页面中除了传统的超链接外,还可以将邮箱地址写入<a>标签,意思不表自明,当然是用户点击后就会打开相应的邮件客户端向这个连接指向的邮件地址发邮件. <a href="mail ...

  2. 简单理解js的prototype属性

    在进入正文之前,我得先说说我认识js的prototype这个东西的曲折过程. 百度js的prototype的文章,先看看,W3School关于prototype的介绍: 你觉得这概念适合定义js的pr ...

  3. 关于MVC4项目从32位机移到64位机编译报错解决方案

    早上写了个MVC WEBAPI的demo 机子环境是:XP SP3+ VS2010 + ASP.NET MVC4 然后晚上拿回笔记本进行编译运行,结果报错如下: “/”应用程序中的服务器错误. 分析器 ...

  4. Java中使用Socket实现服务器端和客户端通讯

    创建服务器端serverSocket import java.io.BufferedReader; import java.io.IOException; import java.io.InputSt ...

  5. Unity2D 之 Sprite点击事件

    以下方法纯属我YY,切勿当真!!! 给 Sprite添加点击事件步骤: 1. 创建一个 Sprite 2. 给Sprite添加一个 Box Collider 2D 3. 将如果脚本放到Sprite上: ...

  6. Objc基础学习记录2

    1.[类 方法名]; //类方法,-静态成员函数, + (void)fun; 2.[对象名 方法名]; //实例方法, -非静态成员函数, - (void) fun; 3.带有冒号必须要有参数; 4. ...

  7. Webdriver实现下载功能,屏蔽掉windows弹出的对话框,FireFox下设置浏览器的属性,两种实现方式:

    一.使用一个全新的FireFox浏览器打开Web应用,浏览器不带任何插件,也未对浏览器做任何默认配置,但需要对浏览器属性进行配置 // 获取浏览器的所有配置文件 ProfilesIni allProf ...

  8. Collections、Arrays 简明

    Collections : 它的出现给集合操作提供了更多的功能.这个类不需要创建对象,内部提供的都是静态方法. 一般方法 Collections. sort (list); list 集合进行元素的自 ...

  9. 样式初始化&lpar;copy&rpar;

    css样式初始化reset文件 pc端 移动端 公共样式 1.pc端 /* normalize.css */ html { line-height: 1.15; /* 1 */ -ms-text-si ...

  10. java实现HTTP Basic认证

    这两天一直在调试EMQ的API,通过HTTP的GET请求,可以查询到订阅列表信息,在浏览器中测试时,需要输入用户名和密码,然后才能显示出结果,输错或者不输入会返回401错误. 通过浏览器输入用户名和密 ...