weinre远程调试
一: 关于weinre
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

五:复制上图中红色框中的js到需要调试的页面
六: 点击上图的链接,进入调试界面,如下:

七:把添加了js的那个页面, 利用手机扫一扫,把pc端的页面扫入手机里面,这时候可以看到捕获到的url如下:

八: 绿色选中即是捕获到的页面,点击Elements工具,就可以进行进行调试了,像chrome开发工具一样进行调试,例如:

如何在App中进行调试
有时候会遇到这样的问题,我们的页面用手机扫一扫,扫出来的页面在手机上是正常的,但是当打包之后,我们的页面确有点问题,那么遇到这种问题,该怎么调试了?
现在以iphone5 为例,说明调试的步骤:
1) 在电脑上安装iTools
2) 手机插入数据线,使itools中的设备连上手机,例如:

3) 点击“应用”,找到对应的应用

4) 选中对应的应用程序,点击应用对应的文件共享,即可以找到打包文件

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使用的例子。
weinre远程调试的更多相关文章
- 使用weinre远程调试
1.调试环境: 1)使用nodejs搭建调试服务器: 先安装node,然后使用npm安装weinre,在node.js安装目录输入以下命令 npm install weinre 2)需要wifi环境和 ...
- grunt、Browsersync服务及weinre远程调试
一.grunt server服务 前端开发时,经常需要把静态文件映射成web服务,传统的做法是丢到apache,但太重太不友好了.开发angular的时候,官方的chrome插件对file:///的支 ...
- Cordova 5 架构学习 Weinre远程调试技术
手机上的页面不像桌面开发这么方便调试.能够使用Weinre进行远程调试以方便开发.本文介绍windows下的安装与使用. 安装 使用npm安装.能够执行: ###npm config set regi ...
- Weinre 远程调试移动端页面
Weinre 是一款远程调试工具,使用JS编写, 可以让我们在电脑上直接调试运行在手机上的远程页面,当你的代码已经发布上线,这时候出现了问题,Weinre就可以帮你调试. 调试场景 调试页面在手机上. ...
- Weinre 远程调试移动端手机web页面
调试场景 1.调试页面在手机上.2.调试工具在PC的chrome3.手机跟pc要在同一个网络环境下,也就是都使用一个wifi 一.安装 Weinre 1.Weinre是基于nodejs实现的,所以使用 ...
- weinre 远程调试 安装 配置
1.第一种方法:安装:npm install -g weinre 2.第一种方法:开启本地监听服务器(修改端口,默认端口是8080):在cmd中运行: weinre --httpPort 8101 - ...
- 安卓手机移动端Web开发调试之Chrome远程调试(Remote Debugging)
一.让安卓打debug模式的apk包 二.将电脑中的chrome升级到最新版本,在chrome浏览器地址栏中输入chrome://inspect/#devices: 在智能手机还未普及时,移动设备的调 ...
- 远程调试weinre的使用
一.用途 *鉴于在浏览器调试移动端页面无法准确反映移动端实际情况并无法高效调试,故常常使用远程调试工具通过电脑连接手机进行调试,常用远程调试方式: 1.chrome连接安卓机远程调试 2.Mac连接苹 ...
- 远程调试 Weinre
什么是远程调试? 说白了,就是可以通过PC端[F12开发者工具]查看并调试移动端的页面内容,如html.css.js.Network资源等. 重要的事情说三遍:weinre所占有的端口不需要和监听页面 ...
随机推荐
- Django models ORM基础操作--白话聊Django系列
上次我们讲完了views视图,那我们这次来看一下Django强大的ORM,可以这么说,你不懂Django的ORM,你就不懂Django,那废话不多说 ORM又称关系对象映射,在ORM里,一张表就是一个 ...
- Verilog HDL实用教程笔记
Verilog HDL实用教程笔记 DRC - Design Rule Check 几何规则检查ERC - Electrical Rule Check 电学规则检查自动参数提取LVS - Logic ...
- xlwt 模块 操作excel
1.xlwt 基本用法 import xlwt #1 新建文件 new_file = open('test.xls', 'w') new_file.close() #2 创建工作簿 wookbook ...
- python3 中引用 HTMLTestRunner.py 模块的注意事项
HTMLTestRunner.py支持python2中运行,如果在python3.6.2中引用HTMLTestRunner.py模块,需要做一下更改: 1.更改HTMLTestRunner.py模块中 ...
- 005-快捷键,host,查看版本
一.系统快捷键 设置 键盘--查看 shift+ctrl +print 区域截图至剪切版 ctrl+alt+箭头 切换工作区 自定义打开终端快捷键 设置->键盘->自定义:名称: ...
- pandas(零)数据结构
pandas的两个主要的数据结构: Series series是一种类似于一维数组的对象,它由一组数据(NumPy数组类型的数据)和一组与之相关的数据标签(索引)组成. from pandas imp ...
- django-admin 登录之后显示页面,表是否显示
如果是超级用户可以全部看到(如图),如果是普通用户,只能看到user与group 虽然实现了其功能,不过有些地方没搞懂,所以有些地方出了写的不好 ```class PermissionsMixin(m ...
- input date 对 placeholder 的支持问题
正常情况下,text 的 input 会显示 placeholder 中的值,date 类型的 input 对其支持不好.实例代码如下: <input type="text" ...
- Python基础(8)_迭代器、生成器、列表解析
一.迭代器 1.什么是迭代 1 重复 2 下次重复一定是基于上一次的结果而来 l=[,,,] count= while count < len(l): print(l[count]) count ...
- Objective-C系列总结之基础知识
//第一个程序示例 #import <Foundation/Foundation.h> int main(int argc,const char * argv[]) { @autorele ...