看了之前的文章，想必大家對WebSocket的原理已經有了一個深入的了解，這一篇文章我們來看一下具體該如何去使用它。
這裡，我用nodejs-websocket實作一個簡單的多人聊天室，從這個小案例中來學會使用WebSocket。
nodejs-websocket用法參見官方api：
https://www.npmjs.com/package/nodejs-websocket
伺服器端：
//安裝引入nodejs-websocket
var ws = require('nodejs-websocket');
console.log("開始建立連接配接...")
//建立服務
var server = ws.createServer((conn) => {
conn.on("text", (str) => {
console.log("接收的資訊 "+str)
//發送資訊
broadcast(str)
})
conn.on("close", (code, reason) => {
console.log("關閉連接配接")
})
})
function broadcast(str) {
//把消息發送到每一個連接配接服務的用戶端
server.connections.forEach(function(connection) {
connection.sendText(str);
})
}
//監聽端口
server.listen(3000)
console.log("WebSocket建立完畢")
用戶端：
<!doctype html>
<html >
<head>
<meta charset="UTF-8">
<title>聊天室1</title>
<script src="http://static.wanlianjin.com/data/m/wlcs/js/nocar/jquery-1.7.2.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<ul id="messages"></ul>
<input id="m" autocomplete="off" /><button>Send</button>
<script>
if(window.WebSocket){
//連接配接伺服器位址
var ws = new WebSocket('ws://100.39.8.55:3000');
ws.onopen = function(e){
console.log("連接配接伺服器成功");
$('button').click(() => {
if($('#m').val()){
//發送消息
ws.send('小紅:'+$('#m').val());
$('#m').val('')
}
})
}
ws.onclose = function(e){
console.log("伺服器關閉");
}
ws.onerror = function(){
console.log("連接配接出錯");
}
//接收消息
ws.onmessage = function(e){
$('#messages').append('<li>'+ e.data +'</li>')
}
}
</script>
</body>
</html>
![CSS顔色搭配（超級贊的幾個網站）ColorSpaceWebGradientsGRADIENT BUTTONSUigradientsCoolHue 2.0EggradientsGradientaMesh GradientCool BackgroundDuotones[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)