使用weinre远程调试网页

原创
2015/02/11 19:11
阅读数 1.2K

   weinre主页    http://people.apache.org/~pmuellr/weinre/docs/latest/Home.html

1 下载nodejs并解压至 nodejsproject/
2 安装weinre
    nodejsproject/bin/npm install weinre       #使用nodejs提供的npm 否则会出错
3 启动weinre
    nodejsproject/node_modules/weinre [someoption]
        options:
        --httpPort     port to run the http server on        default: 8081
        --boundHost    ip address to bind the server to      default: localhost //建议修改为 -all- 监听所有ip
        --verbose      print more diagnostics                default: false
        --debug        print even more diagnostics           default: false
        --readTimeout  seconds to wait for a client message  default: 5
        --deathTimeout seconds to wait to kill client        default: 3*readTimeout
    (手机和服务器必须在同一网段,可以相互访问)
    
    可以在创建配置文件 ~/.weinre/server.properties
        配置文件格式:

boundHost:    -all-
httpPort:     8081
reuseAddr:    true
readTimeout:  1
deathTimeout: 5                        //建议这个时间可以改大一点,要不然调试的连接经常会断开

注意:命令行参数优先级高于配置文件    

   详细的参数 --help
   
4 调试
    1 手机:访问 weinre 服务器, xx.xx.xx.xx:8081
    2 手机:在页面上找到 Target Bookmarklet, 复制下面的js代码,类似下面的格式 地址后面的anonymous可以修改以方便区分不同手机

javascript:(function(e){e.setAttribute("src","http://xx.xx.xx.xx:8081/target/target-script-min.js#anonymous");document.getElementsByTagName("body")[0].appendChild(e);})(document.createElement("script"));void(0);

        可以将js代码保存到书签
    3 手机:打开新的标签页,访问要调试的网页 www.aaa.com/1.html
    4 手机:在www.aaa.com/1.html所在的标签页点击我们保存的书签,可以将我们的代码注入到当前页面,
      或者 直接粘贴js代码到地址栏,回车 注入代码
    5 pc端:访问(wenkit内核的浏览器) http://xx.xx.xx.xx:8081/
        在access point下访问 http://xx.xx.xx.xx:8081/client/#anonymous
    6 pc端:在targets 和clients中分别选择要调试的目标网页和目标设备,然后点击上方的项目选择调试的项目,操作类似firebug

    其他调试方法:
        在html页面中直接引入js。

 <script src="http://xx.xx.xx.xx:8081/target/target-script-min.js"></script>

        

-----------------------------------------------

路径为了大家看起来直观所以不怎么规范 所以请勿照抄


展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
打赏
0 评论
4 收藏
0
分享
返回顶部
顶部