weinre远程调试
2016-04-19 16:25
357 查看
一: 关于weinre
weinre是一款依赖于nodejs的远程调试工具,现阶段一般用到手机app上调试非常的强大
二: weinre的安装
1) 安装 nodejs以及npm
2) 安装weinre
三: weinre使用例子
1) 打开命令行,输入: weinre --boundHost[IP_address] --httpPort[port] (IP_address 是pc的ip地址, 不能是127.0.0.1,port可以输入一个随便的端口)
例如:
四: 在浏览器中输入网址:http:10.32.64.150:1234
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/4d69eed0791898a28ad9fc400cc09bc8.png)
五:复制上图中红色框中的js到需要调试的页面
六: 点击上图的链接,进入调试界面,如下:
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/ff4e52dbaf55a816ec40a4345a236d44.png)
七:把添加了js的那个页面, 利用手机扫一扫,把pc端的页面扫入手机里面,这时候可以看到捕获到的url如下:
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/e25fe80acd9150955ae6ebd6e3870d6d.png)
八: 绿色选中即是捕获到的页面,点击Elements工具,就可以进行进行调试了,像chrome开发工具一样进行调试,例如:
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/25a84b0fa9f6feb43b671192c5e57f96.png)
如何在App中进行调试
有时候会遇到这样的问题,我们的页面用手机扫一扫,扫出来的页面在手机上是正常的,但是当打包之后,我们的页面确有点问题,那么遇到这种问题,该怎么调试了?
现在以iphone5 为例,说明调试的步骤:
1) 在电脑上安装iTools
2) 手机插入数据线,使itools中的设备连上手机,例如:
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/1189f40e4395f87cb93bcd91948a9149.png)
3) 点击“应用”,找到对应的应用
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/66651ad7aa06030c324c7a7ebc43eead.png)
4) 选中对应的应用程序,[b]点击应用对应的文件共享,即可以找到打包文件[/b]
[b]
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/8228743bc55320457c67c8a9efe618eb.png)
[/b]
5) 找到需要调试的页面,在调试的页面上添加如下代码:
备注:10.32.64.150是用weinre开启的ip,一般是你自己电脑的ip地址
1234 是用weinre开启的端口号
6) 点击app中的页面,weinre即会捕获到url,然后点击进行调试,步骤同weiner使用的例子。
weinre是一款依赖于nodejs的远程调试工具,现阶段一般用到手机app上调试非常的强大
二: 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可以输入一个随便的端口)
例如:
weinre --boundHost 10.32.64.150 --httpPort 1234
四: 在浏览器中输入网址:http:10.32.64.150:1234
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/4d69eed0791898a28ad9fc400cc09bc8.png)
五:复制上图中红色框中的js到需要调试的页面
六: 点击上图的链接,进入调试界面,如下:
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/ff4e52dbaf55a816ec40a4345a236d44.png)
七:把添加了js的那个页面, 利用手机扫一扫,把pc端的页面扫入手机里面,这时候可以看到捕获到的url如下:
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/e25fe80acd9150955ae6ebd6e3870d6d.png)
八: 绿色选中即是捕获到的页面,点击Elements工具,就可以进行进行调试了,像chrome开发工具一样进行调试,例如:
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/25a84b0fa9f6feb43b671192c5e57f96.png)
如何在App中进行调试
有时候会遇到这样的问题,我们的页面用手机扫一扫,扫出来的页面在手机上是正常的,但是当打包之后,我们的页面确有点问题,那么遇到这种问题,该怎么调试了?
现在以iphone5 为例,说明调试的步骤:
1) 在电脑上安装iTools
2) 手机插入数据线,使itools中的设备连上手机,例如:
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/1189f40e4395f87cb93bcd91948a9149.png)
3) 点击“应用”,找到对应的应用
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/66651ad7aa06030c324c7a7ebc43eead.png)
4) 选中对应的应用程序,[b]点击应用对应的文件共享,即可以找到打包文件[/b]
[b]
![](https://oscdn.geek-share.com/Uploads/Images/Content/202004/07/8228743bc55320457c67c8a9efe618eb.png)
[/b]
5) 找到需要调试的页面,在调试的页面上添加如下代码:
<script src="http://10.32.64.150:1234/target/target-script-min.js#anonymous"></script>
备注:10.32.64.150是用weinre开启的ip,一般是你自己电脑的ip地址
1234 是用weinre开启的端口号
6) 点击app中的页面,weinre即会捕获到url,然后点击进行调试,步骤同weiner使用的例子。
相关文章推荐
- 设计模式——享元模式
- 【bzoj2882】【工艺】【最小表示法】
- log4j
- 利用ViewFlipper实现实际应用中banner的自动滑动和手动滑动结合。
- request.getInputStream()得不到值
- Linux less命令
- java设计模式之策略模式
- 快速排序的非递归实现
- apache http server/tomcat 端口问题
- 线段树小结
- maven编译的时候跳过test
- ERROR 1205 (HY000): Lock wait timeout exceeded; try restarting transaction(死锁)
- 语音芯片选型
- gcc命令
- Android 创建Library Project(库项目)与引用操作
- TP扩展Xxtea.class.php加密解密函数用法
- 团队站立会议01
- win10 uwp 使用油墨输入
- Java中ArrayList类详解
- openstack swift页面安装