代理抓包工具lightproxy是IFE團(tuán)隊(duì)開發(fā)的一款基于Electron和whistle的開源桌面代理軟件，致力于讓前端開發(fā)人員能夠精確的掌握自己的開發(fā)環(huán)境，通過HTTP代理使用規(guī)則轉(zhuǎn)發(fā)、修改每一個(gè)請(qǐng)求和響應(yīng)的內(nèi)容。該軟件可以提供給用戶良好的開發(fā)環(huán)境從而提高研發(fā)的效率，可以通過基于whistle的代理能力，能夠任意修改開發(fā)環(huán)境中的request和response，例如當(dāng)用戶需要在線上頁(yè)面中加入一個(gè)DIV，如果沒有代理我們需要依賴后端一套類似的預(yù)發(fā)環(huán)境，而有了該軟件用戶只需要使用簡(jiǎn)單的命令就可以在線上添加插入一個(gè)div。小編親測(cè)，軟件可放心使用，需要的朋友快來下載收藏吧。

使用教程

1、在本站下載代理抓包工具(lightproxy)壓縮包，解壓打開后啟動(dòng)exe文件

2、雙擊啟動(dòng)后，即可自動(dòng)安裝，如果期間安全軟件警報(bào)，請(qǐng)選擇允許運(yùn)行。

3、安裝成功后，打開桌面上的快捷方式，即可出現(xiàn)軟件的主頁(yè)面

4、當(dāng)我們需要在線上頁(yè)面中加入一個(gè) DIV ，如果沒有代理我們需要依賴后端一套類似的預(yù)發(fā)環(huán)境，而有了 LightProxy 我們只需要使用：

https://www.alibaba.com/ htmlPrepend://(test)

就可以在一個(gè)線上的頁(yè)面中插入一個(gè) div 

5、同樣的，我們可以直接把頁(yè)面中的一個(gè) JS 轉(zhuǎn)發(fā)到本地一個(gè)開發(fā)中的文件

6、當(dāng)后端缺少 CORS 頭時(shí)，我們可以直接給它先加上 CORS 頭

7、也可以直接把某個(gè)文件變成一個(gè)內(nèi)聯(lián)的文字，只要用類似 ES6 字符串框起來

以上就是代理抓包工具lightproxy的使用攻略了，總而言之它能夠讓開發(fā)者完全掌控自己的開發(fā)環(huán)境，用極低的成本定制自己的開發(fā)環(huán)境，而不是總是在等待依賴方按照自己的需求提供相應(yīng)的環(huán)境。

軟件特色

1、穩(wěn)定

好的開發(fā)環(huán)境首先應(yīng)該是穩(wěn)定可用的，不應(yīng)該在開發(fā)測(cè)試的過程中頻繁掛掉或者頻繁發(fā)生改變。

依賴于后端日常接口進(jìn)行調(diào)試的前端對(duì)這點(diǎn)應(yīng)該深有體會(huì)，自己的問題還沒解決，環(huán)境就時(shí)常帶來新的問題。

2、快速驗(yàn)證

修改代碼能夠在盡可能短的時(shí)間內(nèi)得到驗(yàn)證也是一個(gè)基本訴求，這也是為什么大部分前端構(gòu)建都會(huì)關(guān)注 Hot reload 和更高級(jí)的 HMR 。

有些場(chǎng)景下的修改一次簡(jiǎn)單的修改就要經(jīng)過長(zhǎng)時(shí)間的等待，例如依賴上游修改接口的返回內(nèi)容，需要修改后端的頁(yè)面結(jié)構(gòu)然后重新部署，需要走一遍完整的發(fā)布流程來測(cè)試某個(gè)修改在真實(shí)的線上頁(yè)面會(huì)產(chǎn)生的影響等等。

3、和線上的一致性

很多項(xiàng)目的線上環(huán)境極為復(fù)雜，為了解決日常開發(fā)中的問題，也會(huì)有一個(gè)線下的 DEMO 頁(yè)面，最后開發(fā)完再搬到線上。

這種方式相對(duì)來說較為穩(wěn)定且能快速驗(yàn)證，但比較凸顯的問題在于和線上并不一致。開發(fā)中會(huì)存在很多 if-else 的邏輯，例如最常見的：

const API_BASE = utils.isDaily ? 'http://localhost:7001:': 'https://xxxx/';

這種情況也往往導(dǎo)致 Bug 非常難以被定位，最后逼著開發(fā)者退化到在線上環(huán)境低效的進(jìn)行 debug。

4、確定性

開發(fā)者對(duì)于當(dāng)前的環(huán)境應(yīng)該是有確切認(rèn)知的，而不是一直不停的懷疑自己的配置到底有沒有生效，命中的是不是又是緩存等等。

有些情況下我們利用 hosts 切換工具來進(jìn)行聯(lián)調(diào)，但在切完 hosts 后卻又不得不來回確認(rèn)自己的切換是否生效，清楚 Chrome 的 DNS Cache，清楚 Socket 之類的。

這種非確定性不但提高了開發(fā)者心智負(fù)擔(dān)，而且也會(huì)導(dǎo)致 Bug 難以定位。

軟件亮點(diǎn)

1、快速確認(rèn)功能

為了能夠快速確認(rèn)代理是否按預(yù)期工作，官方在經(jīng)過軟件代理的網(wǎng)絡(luò)請(qǐng)求的Response Header增加了一些相關(guān)的信息，用于協(xié)助開發(fā)人員快速確認(rèn)當(dāng)前請(qǐng)求命中了什么規(guī)則，以及這個(gè)請(qǐng)求是怎么來的（由誰響應(yīng)，匹配什么規(guī)則，實(shí)際真正訪問的來源）

2、沒有銀彈

雖然說代理工具可以快速的解決各種開發(fā)環(huán)境上的坑，但也并不是銀彈。

這種方案更加適合在開發(fā)階段快速繞過各種攔路虎，但最終在多人協(xié)作中仍然需要有健康的環(huán)境來保障項(xiàng)目的協(xié)作流程流暢，不能因?yàn)橛辛舜砉ぞ吆缶屯耆珶o視開發(fā)環(huán)境的問題。