Fiddler 前端利器

大家好，我是小水星。作为一个前端最害怕的事情莫过于公司还在使用JSP技术 Jquery技术，本人有幸就遇见这种情况。

首先咱们从gitlab上拉取项目
git clone xxxxxx
然后询问后端如何跑项目（java配置环境变量，maven配置仓库，tomcat配置，启动参数配置，zookeeper节点配置）
本地配置zookeeper ??? 这我一个前端哪里懂人麻了

然后我们开始正题：如果我们项目已经跑在了测试环境我们能不能让测试环境的站点加载的js文件html文件不是从服务器获取而是从本地获取呢？为了达到这个效果首先我们需要

1. 下载fiddler工具
1. 一个正在运行的项目的测试环境

fiddler中可以使用自动响应来完成这个功能

但是我要介绍的是如何使用脚本srcipt 来实现这个效果

首先我们将测试环境的host或域名添加到过滤器中来限制只查看当前域名的请求

然后我们可以在fiddlerScripts这个选项下添加自己的选项规则

public static RulesOption("资源同步本地 localhost")
var m_sync_test: boolean = false;

然后找到OnBeforeResponse 函数块

添加以下内容

if(m_sync_test){
            var modules = oSession.url.Contains("/src") //需要替换src下的资源
            var testDev = oSession.url.Contains("10.241.60.11/sdk") // 测试环境的地址
            var getM = oSession.HTTPMethodIs("GET") // 请求为get类型
            if(testDev){
                if(modules && getM){
                    var header = "Z:\\" //此处做了磁盘隐射 将项目资源文件映射到了Z盘
                    var filePath = oSession.url.Replace("10.241.60.11/sdk","").Replace("/","\\")
                    if(filePath.IndexOf("?") > -1){ // 路径上去掉?号后面的部分
                        filePath=filePath.Substring(0,filePath.IndexOf("?"))
                    }
                    oSession.LoadResponseFromFile(header + filePath); // 加载本地文件返回资源
                }
            }
        }

举个例子说明

http://10.241.60.11/sdk/src/css/common/side-menu.css => Z:\src\css\common\side-menu.css

我们勾选上我们的新规则

刷新测试环境的地址就会发现测试环境加载的资源是本地提供的此时我们就可以在本地随意修改文件同时刷新测试环境就能看到最新的变更了从此就可以不用运行后端的项目了 (后端的项目既占用内存高又需要各种环境实在是太难受了)

公司项目还在使用JSP不分离模式 前端不会跑Idea后端项目怎么做项目调试？

Fiddler 前端利器

公司项目还在使用JSP不分离模式前端不会跑Idea后端项目怎么做项目调试？