WebSocket(WS)是HTML5開始提供的一種在單個TCP連接上進行全雙工通訊的協(xié)議，它允許服務(wù)端主動向客戶端推送數(shù)據(jù)。在WebSocket API中，瀏覽器

WebSocket(WS)是HTML5開始提供的一種在單個TCP連接上進行全雙工通訊的協(xié)議，它允許服務(wù)端主動向客戶端推送數(shù)據(jù)。在WebSocket API中，瀏覽器和服務(wù)器只需要完成一次握手，兩者之間就可以直接創(chuàng)建持久性的連接，并進行雙向數(shù)據(jù)傳輸。

通常WebSocket可用于替換AJax技術(shù)進行推送，繼而實現(xiàn)成本更低、更實時的通訊，一般WebSocket也主要用于需要進行實時通信的應(yīng)用。

日前Firefox開發(fā)人員在博客中介紹了其將在Firefox 71中引入的WebSocket檢查器。

新的WebSocket檢查器是DevTools中現(xiàn)有“網(wǎng)絡(luò)”面板UI的一部分，在此面板中已經(jīng)可以過濾已打開的WS連接的內(nèi)容，但是目前仍然不能看到通過WS幀傳輸?shù)膶嶋H數(shù)據(jù)。

以下屏幕截圖顯示了運行中的WS過濾器，響應(yīng)代碼指示服務(wù)器正在切換到WS連接。

如下圖所示，邊欄顯示了有關(guān)所選HTTP請求的詳細信息。此外，UI現(xiàn)在提供了一個全新的“消息”面板，該面板可用于檢查通過選定WS連接發(fā)送和接收的WS幀。

實時更新的表顯示了已發(fā)送(綠色箭頭)和已接收(紅色箭頭)WS幀的數(shù)據(jù)，單擊時每個幀都會展開，可以檢查格式化的數(shù)據(jù)。

專注于特定消息的話，可以將幀過濾為自由文本。

默認顯示“數(shù)據(jù)”和“時間”列，但是可以自定義界面查看更多列。

在列表中選擇一個幀的話會在“消息”面板的底部顯示預覽。

該檢查器當前支持以下WS協(xié)議：

純JSON

socket

SockJS

新的WS檢查器將解析基于這些協(xié)議的有效負載并將其顯示為可擴展樹，以便于檢查。當然，仍然可以查看原始數(shù)據(jù)：

使用“網(wǎng)絡(luò)”面板工具欄中的“暫停/繼續(xù)”按鈕可以停止攔截WS通信，方便僅捕獲感興趣的幀。

WebSocket檢查器將在Firefox 71中發(fā)布，現(xiàn)在可以在Firefox Developer Edition中使用。目前Firefox還在對以下功能進行跟進：

二進制有效負載查看器

指示關(guān)閉的連接

導出WS幀(作為HAR的一部分)（h4cd）

關(guān)鍵詞： Firefox 71 WebSocket檢查器 WS