具體看官網有巨詳細介紹：https://www.npmjs.com/package/ws
只要把依賴下載然后運行就能實現即時通訊服務，聽聽就巨爽了有沒有
用起來也超簡單
隨便找個文件夾安裝ws依賴：npm i ws
創建個 ws.js 文件，填入一下代碼
const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8088 }); // websocket的端口
wss.on('connection', function connection(ws) {
ws.on('message', function incoming(message) {
console.log('服務端接受到數據：', message);
// 廣播給所有用戶
wss.clients.forEach(function each(client) {
if (client.readyState === WebSocket.OPEN) {
// client.send(JSON.stringify(message));
client.send(message);
}
});
});
// ws.send('something');
});
執行命令跑起服務：node ws
好了以上就是后台服務，就這么簡單，接下來就是前端websocket的使用了
寫個簡單的前端websocket調用代碼（新建個html文件粘貼以下代碼就能直接測試了）：
<!doctype html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width"> </head> <body> <input id="message-text" type="text"> <button id="send">發送</button> <button id="close">關閉</button> <div id="message-list"></div> </body> <script type="text/javascript"> var ws = new WebSocket('ws://localhost:8088'); ws.onopen = function(evt) { // 連接建立觸發 console.log('建立連接，狀態:' + ws.readyState); }; ws.onmessage = function(evt) { // 服務端返回數據觸發 var data = JSON.parse(evt.data) console.log("狀態：" + ws.readyState + "；服務端返回數據:", data); var list = document.getElementById("message-list"); list.insertAdjacentHTML("beforeEnd", `<div>${data.message}</div>`); }; ws.onerror = function(evt) { // 通信發生錯誤觸發 console.log('發生錯誤，狀態:' + ws.readyState); }; ws.onclose = function(evt) { // 連接關閉觸發 console.log("連接關閉，狀態：", ws.readyState); }; document.getElementById("send").onclick = function () { var val = document.getElementById("message-text").value var data = { message: val } ws.send(JSON.stringify(data)); // 推送數據到服務器, 數據類型必須為字符串 } document.getElementById("close").onclick = function () { ws.close(); // 關閉連接 } </script> </html>
夾帶點私貨可以看看我以前寫的關於websocket的文章(=￣ω￣=)：https://www.cnblogs.com/konghaowei/p/11277365.html
前端代碼也准備好了，打開html文件到瀏覽器看看
初始化確定已經與ws服務連接成功：
接下來就是重頭戲了：多頁面接收消息
好了以上基本就是Node.js WebSocket 庫的主要內容了，
接下來是多端演示效果之前寫好的簡單的聊天室，本來打算部署到我的樹莓派上的，
可我后台實在稀爛很多問題沒搞定，只能局域網自己玩玩
有興趣的可以下載下來看看代碼地址：https://gitee.com/konghaowei/chat-room.git
有興趣也能看看演示視頻鏈接：https://pan.baidu.com/s/1EmZs9nblUl2eZtC_mBwsSw 提取碼：cr4l
希望博客園以后能支持短視頻播放