美文网首页
前端调试解决方案

前端调试解决方案

作者: www当下 | 来源:发表于2018-12-17 10:12 被阅读0次

    前端如何测试自己的代码

    alert

    这个小问题调试还行,一旦进入业务问题,可能就会烦死,不停alert迟早崩溃
    

    console.log

    这个看起来比alert高级一点,一但用过多,毫无头绪,因为代码顺序,有时候错综复杂
    

    代码调试当然不能忘记chrome (ff)

    debugger        
    

    开发阶段ajax测试,考虑跨域

    frame 过时  bad
    jsonp(需要后端配合,而且只能get,局限性太多)bad
    pass_proxy nginx 的模块配置   good
    通过 koa-proxy2 node.js 反向代理  good 
    

    远程调试 (improtant)

    什么情况必须使用远程环境?

    • 开发机器不在身边
    • 线上代码压缩,debugger ,需要改动代码测试
    • 工程复杂度过高,本地无法一下搭建所有的server服务
    • 本地同步开发多环境联调需要

    远程调试方式 fiddler (window), charles (mac)

    工具可以做的事情

    本地代理任何文件
    模拟低网速
    代理手机
    

    fiddler , 跟 charles 如何本地代理

    • charles

       1. 点击tools-->rewrite settings-->左侧的add-->设置右边的name-->右面下边的add(可以匹配正则)--> Type 选择 (url),2个value ,第一个是环境url ,第二个是代理url , 需要勾选Match whole value 跟 选择第一个value 后面的 checkbox
       
       http://192.168.129.48/pc/build/(.*)    --环境url
       http://127.0.0.1/build/$1   ----代理的url
      
    • fiddler

       本地代理的正则匹配全量替代
       regex:(?insx)^http://account.xxd.com/pages/build/(?<folder>.*) --环境中的url
       *redir: http://127.0.0.1/build/${folder}   --代理的url
      
    • 其他工具 tap 这些都是公司内部的一些工具,开源的类似 tapc

    相关文章

      网友评论

          本文标题:前端调试解决方案

          本文链接:https://www.haomeiwen.com/subject/zvkqkqtx.html