解决什么问题:
解决前端在本地联调页面 || 样式 || 脚本时经常修改服务器代码,浪费太多时间。
避免多人同时修改代码产生冲突问题。可以在本地调完代码之后,再贴到服务器上。
其实这个问题老早就开始想过一些办法了。但是之前都是要在服务器中引入本地文件进行调试。有很多缺点。只适合部分场景。
现在这种方案受老吉上次分享会上的启发。稍微做了一些修改写的。可以说基本的前端问题都可以用这种方法来快速联调解决。
利用Fiddler抓包工具进行本地调试方案:
所需工具(一次安装及配置):
Fiddler:百度下载或(https://pan.baidu.com/s/1qYUii88)
Php服务器:http://pan.baidu.com/s/1qXDljgK
对移动端抓包配置:
手机和电脑同时连接一个wifi。如:MIGU
对该wifi进行设置 (你的电脑IP与你的fiddler端口)
对移动端请求进行抓包:
打开fiddler工具
移动端访问页面:
工具抓取到移动端的请求列表:
找到你要本地化的请求:(如:
http://wap.cmread.com/rbc/t/content/repository/ues/js/s109/indexV7.js?time=201712291849
)àAdd Rule
创建本地服务器:
下载一个本地php服务器安装包(如上所需工具)
下一步下一步安装即可(一次安装配置)
安装完成后,进入桌面的某个文件夹:
在文件夹内创建你要调试的文件(如:将你要调的文件另存到本地指定位置):
启动php服务器,端口号设置80,开始&访问http://你的ip:80:
得出你创建的脚本的地址为:http://你的ip/cmread/rbc/t/indexV7.js
工具实现请求重定向到本地文件:
替换:
修改本地代码:
刷新手机页面结果:(本地调试起作用了,且并不影响现网)
本地调试完之后,将调试成功的代码放现网,再将工具的此勾选去掉即可验证现网。