在當今數字化社會，實時通訊已成為人們生活中不可或缺的一部分。無論是在社交媒體平臺上與朋友交流，還是在工作場合中與同事協作，實時聊天應用都扮演著重要角色。與此同時，Node.js作為一種流行的后端技術，為開發者提供了強大的工具和靈活的環境，使得創建實時聊天應用變得輕而易舉。
在本篇博客中，我們將探討如何利用Node.js構建一個基于WebSocket協議的實時聊天應用。WebSocket是一種在單個TCP連接上提供全雙工通信的協議，適用于需要實時性的應用場景，比如在線游戲、實時監控以及聊天應用。
首先，我們需要創建一個基本的Node.js應用，并安裝一些必要的依賴。在命令行中運行以下命令：
mkdir real-time-chat
cd real-time-chat
npm init -y
npm install express ws
上面的命令中，我們創建了一個名為real-time-chat的項目，并安裝了Express框架和ws模塊，分別用于處理HTTP請求和WebSocket連接。
接下來，我們來編寫服務器端的代碼。在項目根目錄下創建一個名為server.js的文件，并添加以下代碼：
const express = require('express');
const http = require('http');
const WebSocket = require('ws');const app = express();
const server = http.createServer(app);
const wss = new WebSocket.Server({ server });wss.on('connection', (ws) => {ws.on('message', (message) => {wss.clients.forEach((client) => {if (client !== ws && client.readyState === WebSocket.OPEN) {client.send(message);}});});
});server.listen(3000, () => {console.log('Server started on http://localhost:3000');
});
在上面的代碼中，我們創建了一個Express應用，并在3000端口啟動了一個HTTP服務器。同時，我們使用WebSocket模塊創建了一個WebSocket服務器，并實現了簡單的消息廣播功能。
現在，我們已經完成了服務器端的搭建。接下來，我們需要創建一個簡單的客戶端界面來與服務器通信。在項目根目錄下創建一個名為index.html的文件，并添加以下代碼：
<!DOCTYPE html>
<html>
<head><title>Real Time Chat</title>
</head>
<body><input type="text" id="message" placeholder="Type your message here"><button onclick="sendMessage()">Send</button><ul id="chat"></ul><script>const socket = new WebSocket('ws://localhost:3000');const chat = document.getElementById('chat');socket.onmessage = (event) => {const li = document.createElement('li');li.textContent = event.data;chat.appendChild(li);};function sendMessage() {const message = document.getElementById('message').value;socket.send(message);}</script>
</body>
</html>
在上面的代碼中，我們創建了一個簡單的HTML界面，包括一個文本輸入框用于輸入消息、一個發送按鈕和一個用于顯示聊天消息的列表。通過WebSocket與服務器建立連接，并實現了接收和發送消息的功能。
最后，我們啟動服務器并在瀏覽器中打開index.html文件，即可看到實時聊天應用的界面。您可以在同一臺機器上打開多個瀏覽器窗口，模擬多人聊天的場景，體驗實時通訊的魅力。
通過本篇博客的介紹，您學會了如何利用Node.js和WebSocket創建一個簡單的實時聊天應用。當然，這只是一個入門級的示例，在實際應用中還有很多功能和性能優化的空間。希望本文能對您有所啟發，讓您深入了解實時通訊技術，不斷完善和優化您的應用。
Node.js視頻教程請點擊：Node.js從基礎到項目實踐_在線視頻教程-CSDN程序員研修院
最后問候親愛的朋友們，并邀請你們閱讀我的（博主簡介）全新著作。
![[前端]開啟VUE之路-NODE.js版本管理](http://pic.xiahunao.cn/[前端]開啟VUE之路-NODE.js版本管理)
