什么是远程调试?

说白了,就是可以通过PC端【F12开发者工具】查看并调试移动端的页面内容,如html、css、js、Network资源等。

重要的事情说三遍:weinre所占有的端口不需要和监听页面的端口一致,比如说weinre使用了http://10.110.1.26/:8080端口,然后我监听的页面是运行在http://10.110.1.26/:8081端口也没关系的。

重要的事情说三遍:weinre所占有的端口不需要和监听页面的端口一致,比如说weinre使用了http://10.110.1.26/:8080端口,然后我监听的页面是运行在http://10.110.1.26/:8081端口也没关系的。

重要的事情说三遍:weinre所占有的端口不需要和监听页面的端口一致,比如说weinre使用了http://10.110.1.26/:8080端口,然后我监听的页面是运行在http://10.110.1.26/:8081端口也没关系的。

超爽的事情说三遍:远程调试可以配合热编译使用

超爽的事情说三遍:远程调试可以配合热编译使用

超爽的事情说三遍:远程调试可以配合热编译使用

(PS:最终效果图在本页面底部)


官方网站

http://people.apache.org/~pmuellr/weinre/docs/latest/Installing.html

安装(需要Nodejs和Npm环境)

weinre is also deployed on https://npmjs.org/package/weinre so that you can install it via:

sudo npm -g install weinre

打开CMD ,输入以下命令开启服务

weinre --boundHost -all-

打开localhost:8080 出现以下界面说明安装成功了

Weinre还提供了下面的启动参数:

--help : 显示Weinre的Help

--httpPort  [portNumber] : 设置Weinre使用的端口号, 默认是8080

--boundHost  [hostname| ip address | -all-] : 默认是'localhost', 这个参数是为了限制可以访问Weinre Server的设备, 设置为-all-或者指定ip, 那么任何设备都可以访问Weinre Server。

--verbose  [true | false] : 如果想看到更多的关于Weinre运行情况的输出, 那么可以设置这个选项为true, 默认为false;

--debug  [true | false] : 这个选项与--verbose类似, 会输出更多的信息。默认为false。

--readTimeout  [seconds] : Server发送信息到Target/Client的超时时间, 默认为5s。

--deathTimeout  [seconds] : 默认为3倍的readTimeout, 如果页面超过这个时间都没有任何响应, 那么就会断开连接。

更多参数可以访问http://people.apache.org/~pmuellr/weinre/docs/latest/Running.html


如何进行远程调试?必须先让手机端能正常访问上PC端本地的网站。

请参考这篇文章:http://www.cnblogs.com/CyLee/p/6037732.html

并且必须成功才可以进入下一步

在开启的weinre服务页面中,有这样一段脚本引入代码

将其放入调试的页面中即可,

但请注意这里的地址

是ip地址,并不是localhost,

是ip地址,并不是localhost,

是ip地址,并不是localhost;

接着,找到weinre服务页面中的另一个页面

进入这个页面后,如下图所示,默认的Targets为none  这说明还没有任何页面访问

这时候,手机登陆已经加入<script>标签的页面,targets发生了变化,就说明成功了

紧接着打开顶部的【elements】栏目即可看到熟悉的控制台界面了。

当鼠标经过DOM元素时,手机端会出现调试效果。

可以在console中调试javascript代码

以上!!!

远程调试 Weinre的更多相关文章

  1. 远程调试weinre的使用

    一.用途 *鉴于在浏览器调试移动端页面无法准确反映移动端实际情况并无法高效调试,故常常使用远程调试工具通过电脑连接手机进行调试,常用远程调试方式: 1.chrome连接安卓机远程调试 2.Mac连接苹 ...

  2. 使用weinre远程调试

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

  3. grunt、Browsersync服务及weinre远程调试

    一.grunt server服务 前端开发时,经常需要把静态文件映射成web服务,传统的做法是丢到apache,但太重太不友好了.开发angular的时候,官方的chrome插件对file:///的支 ...

  4. Cordova 5 架构学习 Weinre远程调试技术

    手机上的页面不像桌面开发这么方便调试.能够使用Weinre进行远程调试以方便开发.本文介绍windows下的安装与使用. 安装 使用npm安装.能够执行: ###npm config set regi ...

  5. Mobile Web 调试指南(2):远程调试

    原文:http://blog.jobbole.com/68606/ 原文出处: 阿伦孟的博客(@allenm ) 第一篇中讲解了如何让手机来请求我们开发电脑上的源码,做到了这步后,我们可以改完代码立即 ...

  6. chrome 远程调试(转)

    http://www.tuicool.com/articles/ZJfeAzi 由于 appspot.com被墙,一般调试不成功. 随着智能手机的普及,移动设备的浏览器功能越来越强大,我们用手机上网时 ...

  7. 移动端调试 weinre

    weinre 是基于 Node 的工具,因此使用如下命令安装 weinre $ npm install -g weinre 用上面的命令将 weinre 安装到全局,然后就可以使用 weinre的命令 ...

  8. 发现一款移动web端远程调试工具weinre , 哈哈!

    之前调试一直用的是chrome的远程调试,虽然效果很不错,但是在调试cordova,微信时多有不便. 在git上找工具时发现了这个:weinre,使用方法非常简单 附上git地址: https://g ...

  9. 很有用的mobile web application远程调试工具 weinre

    在移动web应用中,因为没有类似chrome和firebug的调试工具,调试起来比在PC上相对麻烦一些,有时候仅仅能重复进行改动比对,但使用weinre我们能够轻松做到远程调试的功能. 什么是wein ...

随机推荐

  1. CentOS通过日志反查入侵(转)

    1.查看日志文件 Linux查看/var/log/wtmp文件查看可疑IP登陆 last -f /var/log/wtmp  该日志文件永久记录每个用户登录.注销及系统的启动.停机的事件.因此随着系统 ...

  2. ubuntu系统使用dnw下载程序

    转:http://blog.chinaunix.net/uid-22030783-id-3350840.html 获得dnw4linux.tar.bz2 源码包,可在xcembed论坛下载:http: ...

  3. appium+python自动化47-首次打开app权限弹窗问题

    前言 用真机运行appium代码,首次打开app有的手机会出现权限弹窗问题,一般这种弹窗都是在引导页前面或者引导页后面出现.权限弹窗上面的按钮都是固定的, 只需要定位到"始终允许" ...

  4. EasyUI numbox输入框,金额格式化显示

    1.HTML文件 <th id="sellerHopePrices_Th">委托方保留价:</th> <td id="sellerHopeP ...

  5. python编码规范、js编码规范及IDE的检查插件pylint/eslint等

    一.python规范 参考:https://zh-google-styleguide.readthedocs.io/en/latest/google-python-styleguide/的风格规范和语 ...

  6. 基于CentOS与VmwareStation10搭建Oracle11G RAC 64集群环境:4.安装Oracle RAC FAQ-4.7.Oracle 11G R2 RAC修改public网络IP

    问题:Linuxrac2节点的public网IP被占用,导致集群节点2无法访问 1.禁止相关CRS资源的启动,停止这些资源(vip,listener,scan,scan_listener,databa ...

  7. VB6.0 中 碰到 提示rs对象关闭,不允许操作, 吃一堑长一智

    VB6.0 中 碰到 提示rs对象关闭,不允许操作,  吃一堑长一智 如果碰到 这个错误提示 则请检查 你执行的每一个语句中的数据类型,包括 如果有存储过程的话,还要检查 存储过程中每一个变量和数据表 ...

  8. phpmyadmin4.1.4安装配置教程

    phpMyAdmin 就是一种 MySQL 数据库的管理工具,安装该工具后,即可以通过 web 形式直接管理 MySQL 数据,而不需要通过执行系统命令来管理,非常适合对数据库操作命令不熟悉的数据库管 ...

  9. 《深入理解Java虚拟机》笔记4

    垃圾回收器是垃圾回收算法的实现,Java虚拟机的设计者为了 获取最大的性价比,也在不断改进中.硬件在不断变化,多核 的普及,基于单核的收集器应该已经没有太大意义了.Java7中 又新增了g1收集器,没 ...

  10. 求函数 y=x^2-2x-3/2x^2+2x+1 的极值

    解:展开函数式得到2yx2+2xy+y=x2-2x-3 继而得到(2y-1)x2+(2y+2)x+(y+3)=0 将上式看作x的二次方程,y组成了方程的系数. 只有Δ>=0,x才有实值. Δ=( ...