[[330889]]

一群從事絕密項(xiàng)目而不自知的JavaScript開(kāi)發(fā)人員，該用什么樣的方法來(lái)提取他們的代碼呢？本文的故事就是關(guān)于這個(gè)的。這些技術(shù)之所以有效，是因?yàn)闉g覽器在不需要多重防護(hù)的條件下就允許公共來(lái)源的websockets打開(kāi)本地主機(jī)的websockets連接。

這讓筆者產(chǎn)生了一些思考。筆者知道流行的JavaScript框架在開(kāi)發(fā)中使用websockets，以在內(nèi)容更改時(shí)自動(dòng)重新加載頁(yè)面。一個(gè)惡意的網(wǎng)站能不能竊聽(tīng)到這些流量，并找出開(kāi)發(fā)人員在何時(shí)保存下的代碼？

事實(shí)比想象的還要糟糕。

計(jì)劃如下：

· 進(jìn)行一些設(shè)置，或是將廣告惡意軟件注入前端開(kāi)發(fā)人員經(jīng)常訪問(wèn)的熱門(mén)網(wǎng)站。比如說(shuō) 
http://frontend-overflowstack.com/

· 在此頁(yè)上，添加嘗試打開(kāi)到公共端口的websockets連接的代碼（掃描10k端口大致需要一秒鐘，因此可以在這里輕松實(shí)現(xiàn)此功能）

· 如果頁(yè)面成功打開(kāi)連接，請(qǐng)保持打開(kāi)狀態(tài)，并將收到的所有消息轉(zhuǎn)發(fā)到自己的秘密數(shù)據(jù)庫(kù)。

計(jì)劃生效了嗎？

一個(gè)非常簡(jiǎn)單的頁(yè)面就能驗(yàn)證：http://frontend overflowstack.com/。加載時(shí)，它會(huì)嘗試將websocket連接到訪客計(jì)算機(jī)上2000到10000之間的每個(gè)端口（除了Firefox不允許的幾個(gè)端口）。

如果某個(gè)端口連接，它將偵聽(tīng)該端口輸出接收到的任何消息。此頁(yè)不會(huì)保存或傳輸任何捕獲的數(shù)據(jù)，僅在屏幕上臨時(shí)顯示。如果此頁(yè)上出現(xiàn)任何輸出，則實(shí)際惡意站點(diǎn)可以很容易地將該輸出發(fā)送到其所需的任何服務(wù)器。

生成數(shù)據(jù)

為了測(cè)試這個(gè)概念，我需要一個(gè)簡(jiǎn)單的使用熱加載的web服務(wù)器：

var express =require('express') 
                              var http =require('http') 
                              var path =require('path') 
                              var reload =require('reload'); 
             var app = express() 
                                app.get('/', function (req, res) { 
                                res.sendFile(path.join(__dirname, 'public', 'test.html')); 
                              }) 
    var server = http.createServer(app) 
                               reload(app).then(function(reloadReturned) { 
                                server.listen(3000, function () {}); 
                                setInterval(reloadReturned.reload, 5000); 
                              }); 

當(dāng)運(yùn)行時(shí)，它會(huì)啟動(dòng)端口3000上的服務(wù)器，端口9856上的websocket服務(wù)器，并發(fā)送一條消息：每5秒重新加載(reload )鏈接所有websocket的客戶(hù)端。如果啟動(dòng)嗅探器站點(diǎn)，將顯示以下內(nèi)容：

因此，前端overflowstack.com可直接竊聽(tīng)重載消息，這些消息從本地開(kāi)發(fā)服務(wù)器發(fā)送到本地瀏覽器。在這個(gè)階段，我們可以坐下來(lái)數(shù)一數(shù)每個(gè)訪問(wèn)我們網(wǎng)站的人對(duì)本地JavaScript代碼進(jìn)行了多少次更改。

但是，可以用這種方式來(lái)獲取更多信息嗎？

情節(jié)更復(fù)雜了

目前大多數(shù)的前端開(kāi)發(fā)似乎都會(huì)使用React，通常這涉及到運(yùn)行webpack dev服務(wù)器，其中包括它自己的，以及更繁多的web socket接口。該服務(wù)器通過(guò)其websocket可共享更多數(shù)據(jù)，只是更有趣些：

$ npxcreate-react-app test 
$ cd test/ 
$ npm start 

運(yùn)行這些代碼之后，再來(lái)看看我們的惡意網(wǎng)站：

馬上就會(huì)有更多的數(shù)據(jù)顯示出來(lái)，得到散列式和狀態(tài)式的消息，以及所有無(wú)用的信息。當(dāng)開(kāi)發(fā)人員輸入錯(cuò)誤時(shí)，會(huì)發(fā)生什么？webpack dev服務(wù)器通過(guò)其websocket連接，嘗試將一堆調(diào)試和堆棧信息發(fā)送到開(kāi)發(fā)人員的屏幕上。這些信息在惡意網(wǎng)站也能看到：

現(xiàn)在，我們有了代碼片段、文件路徑、位置等各種有用的信息。甚至當(dāng)開(kāi)發(fā)人員最終意外地在包含有用數(shù)據(jù)的代碼行上鍵入錯(cuò)誤時(shí)，得到的結(jié)果會(huì)更好：

現(xiàn)在你可獲得一份開(kāi)發(fā)人員的AWS開(kāi)發(fā)人員證書(shū)副本。

沒(méi)有圖表，任何技術(shù)設(shè)計(jì)都是不完整的。這里展示了圖像化的代碼運(yùn)行：

為了簡(jiǎn)化圖表，此處省略了正在運(yùn)行的本地web服務(wù)器，并假設(shè)websocket服務(wù)器直接來(lái)自于編輯器中。

某些瀏覽器選項(xiàng)卡上的惡意網(wǎng)頁(yè)會(huì)自動(dòng)連接到用戶(hù)計(jì)算機(jī)上打開(kāi)的WebSocket。當(dāng)敏感數(shù)據(jù)通過(guò)該套接口發(fā)送時(shí)（從希望通過(guò)僅本地通道進(jìn)行通信的進(jìn)程發(fā)送），網(wǎng)站可以接收該消息數(shù)據(jù)，并將其轉(zhuǎn)發(fā)到任何外部數(shù)據(jù)庫(kù)。

限制因素

值得注意的是，該攻擊向量很小。必須誘使不知情的用戶(hù)訪問(wèn)網(wǎng)站，并在他們開(kāi)發(fā)JS代碼時(shí)繼續(xù)使用它。然后，必須等待在較為幸運(yùn)的情況下從他們的編碼錯(cuò)誤中收集一些數(shù)據(jù)，這也許有助于找到從這些數(shù)據(jù)中獲利的突破口。

綜合考慮

然而，許多網(wǎng)站已經(jīng)在使用websocket端口掃描技術(shù)，而沒(méi)有太多開(kāi)發(fā)人員能意識(shí)到這一點(diǎn)?？紤]到JS工具傾向于使用那些眾所周知的端口的小部分，編寫(xiě)一個(gè)腳本來(lái)巧妙地過(guò)濾react Dev通信量并不是特別困難。

想象一下，一個(gè)為T(mén)witbook工作的內(nèi)部開(kāi)發(fā)人員只需在其編輯器中按save鍵，就會(huì)導(dǎo)致訪問(wèn)令牌或內(nèi)部服務(wù)器地址被泄露給錯(cuò)誤的訪問(wèn)者。

這有點(diǎn)嚇人，正常開(kāi)發(fā)人員通常會(huì)希望在他們選擇的代碼編輯器中按下save鍵時(shí)，是不會(huì)將數(shù)據(jù)泄漏到第三方web服務(wù)的。而這增加了這種風(fēng)險(xiǎn)，足以讓人有點(diǎn)擔(dān)心。

補(bǔ)救

筆者的建議是這種嘗試攔截JavaScript熱加載機(jī)制的方法，它是筆者所熟悉的websockets的唯一通用方法。Discord也使用websockets，但匆匆一瞥并不會(huì)產(chǎn)生任何明顯的效果，因?yàn)樵撏ǖ酪怨不ヂ?lián)網(wǎng)為設(shè)計(jì)目標(biāo)。

令人擔(dān)憂(yōu)的是，僅僅這一個(gè)用于重新加載的單向通信簡(jiǎn)單用例，就將如此多的潛在信息暴露給了那些惡意網(wǎng)站。websockets的其他用途（對(duì)于不是為公共互聯(lián)網(wǎng)設(shè)計(jì)的數(shù)據(jù)）也可能受到類(lèi)似的威脅。

爭(zhēng)論在于，webpack dev服務(wù)器應(yīng)該進(jìn)行一些身份驗(yàn)證，或者使用備用的瀏覽器通信通道進(jìn)行熱重載。瀏覽器/web標(biāo)準(zhǔn)為websockets實(shí)現(xiàn)源代碼策略的方式無(wú)疑令人驚訝。導(dǎo)致那些專(zhuān)為本地開(kāi)發(fā)而設(shè)計(jì)的軟件以一種難以預(yù)料的方式暴露在公共互聯(lián)網(wǎng)上。

很期待針對(duì)瀏覽器中額外控制功能部分的修復(fù)。