使用phonegap开发的应用在真机上和PC上的显示效果以及浏览器渲染方式还是有些区别的.在PC端很好调试,各种浏览器都自带了调试工具,使用起来很方便,但是在一旦安装到了手机上,这个时候要进行调试就需要使用weinre这款优秀的远程调试工具了,本文主要讲笔者是怎么一步步去使用这个工具去进行调试的,以前都是在chrome浏览器上测试好效果,直接安装到手机上,如果有问题再回来修改然后再安装,这样做起来是非常麻烦的,效率也很低. 第一步,安装weinre,这里以win7系统做为测试环境 在这一步之前,…
1.调试环境: 1)使用nodejs搭建调试服务器: 先安装node,然后使用npm安装weinre,在node.js安装目录输入以下命令 npm install weinre 2)需要wifi环境和webkit浏览器. 2.远程调试: 1)启动weinre服务器 d: //在命令行中进入d盘 cd Nodejs //进入Nodejs安装目录 此处是d:/Nodejs node.exe node_modules\weinre\weinre --boundHost -all- //启动weinre…
一.grunt server服务 前端开发时,经常需要把静态文件映射成web服务,传统的做法是丢到apache,但太重太不友好了.开发angular的时候,官方的chrome插件对file:///的支持不好,所以最好在web浏览器里面.在 Grunt 环境下,可以直接使用集成在 Grunt 中的 Connect 插件完成站点服务器的支持.在 connect 中设置一个 connect 任务的名字,注意不要叫 options ,这是 connect 保留的配置名.我们这里称为 server.  '…
一.用途 *鉴于在浏览器调试移动端页面无法准确反映移动端实际情况并无法高效调试,故常常使用远程调试工具通过电脑连接手机进行调试,常用远程调试方式: 1.chrome连接安卓机远程调试 2.Mac连接苹果机远程调试 3.使用远程调试工具,比如本文档的主角——weinre 二.weinre安装 1.先在本机全局安装node 2.启动命令行工具执行npm安装程序安装weinre包 npm install weinre -g(需host支持) npm install weinre@2.0.0-pre-I…
Weinre 是一款远程调试工具,使用JS编写, 可以让我们在电脑上直接调试运行在手机上的远程页面,当你的代码已经发布上线,这时候出现了问题,Weinre就可以帮你调试. 调试场景 调试页面在手机上. 调试工具在PC的chrome 手机跟pc要在同一个网络环境下,也就是都使用一个wifi 安装Weinre Weinre是基于nodejs实现的,所以使用它必须先安装node运行环境,新版的node已经集成了npm, 所以直接在在命令行键入下面的命令即可安装, 如果你是Mac/Linux用户, 还需…
什么是远程调试? 说白了,就是可以通过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…
手机上的页面不像桌面开发这么方便调试.能够使用Weinre进行远程调试以方便开发.本文介绍windows下的安装与使用. 安装 使用npm安装.能够执行: ###npm config set registry "https://npmjs.org" npm install -g weinre 安装完路径可能是这种: 输入命令 weinre –boundHost -all- 就可以启动. 其他參数: boundHost: -all- httpPort: 8081 reuseAddr: t…
.页面调试+抓包 2.操作简单 3.支持HTTPS. 4.spy-debugger内部集成了weinre.node-mitmproxy.AnyProxy. 5.自动忽略原生App发起的https请求,只拦截webview发起的https请求.对使用了SSL pinning技术的原生App不造成任何影响. 6.可以配合其它代理工具一起使用(默认使用AnyProxy) (设置外部代理) 安装 Windows 下 npm install spy-debugger -g Mac 下 sudo npm i…
原文:http://blog.jobbole.com/68606/ 原文出处: 阿伦孟的博客(@allenm ) 第一篇中讲解了如何让手机来请求我们开发电脑上的源码,做到了这步后,我们可以改完代码立即看到效果,但是对于调试还是远远不够的.这篇文章我们继续讲目前常用的几种 Developer tools. PC 端的经验 在使用桌面浏览器开发时,几乎每种浏览器都有自己的开发者工具,比如大家常用的 firebug , chrome develper tools , safari developer…
http://www.tuicool.com/articles/ZJfeAzi 由于 appspot.com被墙,一般调试不成功. 随着智能手机的普及,移动设备的浏览器功能越来越强大,我们用手机上网时,看到的再也不是难看的 wap 页面了.移动页面越来越复杂,随之而来的就是前端开发者需要面对更多开发和调试的问题.回想十年前,web 前端开发的工具十分匮乏,这种窘境一直持续到 Firefox 和 Firebug 出现,才算是有了起色. 移动 web 前端开发毫不意外的重演了这段历史.两年前我刚接触…