Node.js+Socket.io搭建簡單的websocket伺服器
阿新 • • 發佈：2018-12-09
因為專案原因需要使用websocket這種全雙工的通訊方式，但是在後端伺服器還沒搭建好的情況下，就只能自己搭建一個測試伺服器，下面我將一步步的列舉單間過程；
開發工具：webstorm
1.服務端
第一步：新建一個專案資料夾，開啟webstorm，進入該專案資料夾，我所建的檔案及名稱為websoket，所以在控制檯顯示的路徑如下：
第二步：在當前目錄下生成一個package.json檔案
執行如下命令
npm init
第三步： 接下來使用npm命令安裝express和socket.io
|
1 2 |
|
安裝成功後，應該可以看到工作目錄下生成了一個名為node_modules的資料夾，裡面分別是express和socket.io，接下來可以開始編寫服務端的程式碼了。
第四步：新建一個index.js檔案
var app = require('express')(); var http = require('http').Server(app); var io = require('socket.io')(http); app.get('/', function(req, res){ res.send('<h1>Welcome Realtime Server</h1>'); }); http.listen(3000, function(){ console.log('listening on *:3000'); });
第五步：在控制檯執行如下命令，啟動服務
node index
完成以上步驟，簡單的服務端架搭建好了；接下來完成客戶端
2.客戶端
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script> window.onload = function () { var ws = new WebSocket('ws://localhost:3000'); ws.onopen = function (e) { console.log("連線伺服器成功"); ws.send("game1"); } } </script> </body> </html>
以上就是全部步驟，我所搭建的客戶端和服務端都比較簡單，目的就是為了走一遍完整流程，如果還需要其他功能，可自行新增。