關於 WebSocket
http 協議存在一個缺陷：通訊只能由客戶端發起
如果服務器有連續的狀態變化，客戶端要獲知就需要向服務器輪詢，由於輪詢的效率低，浪費資源。 WebSocket 因此而發明 。
在不斷地建立HTTP連接，然後等待服務端處理，可以體現HTTP協議的另外一個特點，被動性。
關於 WebSocket 和 Socket 的聯繫和區別
WebSocket 特點
服務器可以主動向客戶端推送信息，客戶端也可以主動向服務器發送信息，是真正的雙向平等對話，屬於服務器推送技術的一種。
- 建立在 TCP 協議之上，服務器端的實現比較容易。
- 與 http 協議有着良好的兼容性，握手階段採用 http 協議
- 數據格式比較輕量，性能開銷小，通信高效。
- 可以發送文本，也可以發送二進制數據。
- 沒有同源限制，客戶端可以與任意服務器通信。
- 協議標識符是ws（如果加密，則爲wss），服務器網址就是 URL。
Node.js 輕鬆實現 WebSocket服務
step1 : 安裝 node.js
step2 : node install –save ws
安裝 websocket 庫 ws
step3 : 創建服務
在剛纔安裝 ws 庫的更目錄創建一個 server.js
var WebSocketServer = require('ws').Server;
console.log('WebSocket Service running...');
// 啓動了一個監聽 8181 端口的 websocket 服務 -> ws://localhost:8181
wss = new WebSocketServer({ port: 8181 });
wss.on('connection', function (ws) {
console.log('client connected');
ws.on('message', function (message) {
console.log(message);
});
});
step4 : 啓動服務
node server.js
step5 : Client 端
隨意命名 client 端的名字，最終這個靜態網頁是直接打開的
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>WebSocket</title>
<script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.js"></script>
<script>
var ws = new WebSocket("ws://localhost:8181");
ws.onopen = function (e) {
console.log('Connection to server opened');
}
function sendMessage() {
console.log('Client send:' + $('#message').val() );
ws.send($('#message').val());
}
</script>
</head>
<body >
<input class="form-control" type="text" name="message" id="message" placeholder="Type text to echo in here" value="" />
<button type="button" id="send" class="btn btn-primary" onclick="sendMessage();">Send </button>
</body>
</html>
運行結果
