H5移动端调试

  1. weinre是基于nodeJs程序,安装weinre包

首先 PC端要安装有node环境  没有的话先点击处安装 点击此处安装  

npm install -g weinre

2.  启动weinre服务 (代理【agent】服务)

weinre --boundHost 1111111 --httpPort 8888    

 其中111111 是本机的ip地址     可以在cmd 终端 命令行输入ipconfig查询  :如下 IPv4 


   连接特定的 DNS 后缀 . . . . . . . : dc.dianrong.com ipa.dianrong.com dianrong.com
   本地链接 IPv6 地址. . . . . . . . : fe80::8044:6ad4:c043:579c%20
   IPv4 地址 . . . . . . . . . . . . : 111111
   子网掩码  . . . . . . . . . . . . : 255.255.248.0
   默认网关. . . . . . . . . . . . . : 10.9.24.1

  3. 启动服务后  会有如下提示   weinre: starting server at  weinre: starting server at http://111111:8888

 上述http 地址 可以在浏览器打开   如下  H5移动端调试_第1张图片

 把最下面的script 标签 加入到需要测试的页面body中    然后点击最上面的 

 

debug client user interface:http://11111111/client/#anonymous  链接   就会键入 调试 

H5移动端调试_第2张图片

 

如果想在手机端实时调试   可以如下设置代理:  ios系统  找到 设置 ——wifi——  http代理  ——点击手动

 服务器  设置为 ipconfig 查找到的IPv4   地址   

端口号  设置为  测试页面在电脑端访问的端口号  

这时候 就可以  在手机浏览器 打开了  前面要http     例如  http:// 1111111:3000

测试完后 记得把代理设置为 关闭   否则会影响正常上网 

 

 强大的fiddler 

  • 下载安装Fiddler 
     
  • 开启Fiddler的远程连接,Fiddler菜单栏 Tools->Fiddler Options  ->Connections,把Allowremote computers to connect选√,然后重启Fiddler。

  •  cmd 命令行获取  输入ipconfig  获取  记住IPv4地址 
  •   如果想在手机端实时调试   可以如下设置代理:  ios系统  找到 设置 ——wifi——  http代理  ——点击手动

     服务器  设置为 ipconfig 查找到的IPv4   地址   

    端口号  设置为  fiddler 监听的  端口号 ,

  •  设置完以上步骤就可以在手机上打开自己开发的网页并调试

   如果想  直接console 信息  ,可以借助第三方库 ,在线调试 Eruda

在body 中添加如下代码 ,可以在手机上显示 如电脑一样的调试面板。


 

具体参考 github  :https://github.com/liriliri/eruda/blob/master/doc/README_CN.md

 

你可能感兴趣的:(H5移动端调试)