它有很多名字; WebSocket，WebSocket協議和WebSocket API。從首選的消息傳遞應用程序到流行的在線多人游戲，WebSocket在當今最常用的Web應用程序中是至關重要的。

根據定義，WebSocket是通過單個TCP連接提供全雙工（雙向通信）通信信道的計算機通信協議。此WebSocket API可在用戶的瀏覽器和服務器之間進行雙向通信。用戶可以向服務器發送消息并接收事件驅動的響應，而無需輪詢服務器。 它可以讓多個用戶連接到同一個實時服務器，并通過API進行通信并立即獲得響應。

WebSockets允許用戶和服務器之間的流連接，并允許即時信息交換。在聊天應用程序的示例中，通過套接字匯集消息，可以實時與一個或多個用戶交換，具體取決于誰在服務器上“監聽”（連接）。

WebSockets不僅限于聊天/消息傳遞應用程序。它們適用于需要實時更新和即時信息交換的任何應用程序。一些示例包括但不限于：現場體育更新，股票行情，多人游戲，聊天應用，社交媒體等等。

WebSockets還會考慮代理和防火墻等危險，使得任何連接都可以進行流式傳輸。它支持單個連接的上游和下游通信。 它還減輕了服務器的負擔，允許現有機器支持同時連接。

這是現代Web應用程序中的示例實現WebSockets。在下面的示例中，我使用WebSockets作為帶有Rails 5 API后端和React.js前端的即時消息應用程序。這絕不是一個指南，而是一個如何使用它的例子。我使用了Action Cable，它是Rails的包裝器，可以無縫地集成Ruby中WebSockets的主要功能，并允許在整個域模型中輕松實現。 它內置于Rails 5.2中，因此無需安裝/執行任何外部庫或gem。

它的工作原理是Pub-Sub（發布和訂閱）。它適用于發送者將數據（發布者）發送給抽象數量的收件人（訂閱者），而無需指定他們是誰。

第一步是將服務器掛載到路由文件中，這樣前端就可以從流中得到endpoint：

在第5行，我設置了ActionCable服務器端點

下一步是在后端創建一個通道，以便在實時創建消息時對消息進行流式處理。

這是管理消息創建以及廣播消息的消息通道

這里我們有兩種方法，訂閱和接收。訂閱的第一種方法允許將消息通道流式傳輸到連接的用戶或訂戶。 接收的第二種方法管理消息創建和廣播消息。我實現了JWT用戶身份驗證，以便可以將消息追溯到用戶，只有具有有效用戶帳戶的消息才能創建消息。

對于我的應用程序的前端，我使用它們npm package actioncable從客戶端到服務器端連接到WebSocket API。 這個包直接來自于Rails的團隊。 使用此庫，我實例化了一個cableApp實例，并將其作為props傳遞給需要訪問WebSocket連接的組件。

導入actionCable并創建了一個cableApp實例，然后將cableApp連接到我的后端端點“/ cable”并將其傳遞給需要連接的組件

然后，我通過React.js生命周期方法componentDidMount（）連接到WebSocket的連接，并在每次將組件安裝到DOM時建立連接。

在componentDidMount（）中，我建立了客戶端以連接到WebSocket協議，該協議從我的Rails API中的“messagesChannel”流式傳輸。

現在，每次創建消息并將其發送到接收方法時，訂閱（d）用戶將立即接收并能夠實時查看消息。此實現支持訂閱同一頻道的多個用戶。因此，如果多個用戶簽名并訂閱了相同的頻道，他們可以發送所有訂閱者都能看到的消息以及從其他訂閱者接收消息。當然，你可以限制為兩個人，并使它成為p2p，但是那樣還有什么樂趣呢？

我希望通過閱讀本文，可以看到WebSockets的潛力。它使自己成為一個寶貴的資源，在這個時代，信息交換需要很快完成。 希望讀者將在自己的項目中實現它們。