轉載自：https://blog.csdn.net/iningwei/article/details/100106243
前言
nodejs遊戲服務器開發系列文章以nodejs+Typescript+CocosCreator+WebSocket爲例，搭建服務器和客戶端。
WebSocket介紹
官網:http://websocket.org/index.html
詳細介紹參考阮一峯的教程：http://www.ruanyifeng.com/blog/2017/05/websocket.html
還有這兩篇文章，寫的非常好：WebSocket介紹一，WebSocket介紹二
官方API地址：https://developer.mozilla.org/zh-CN/docs/Web/API/WebSocket
需要注意：
RFC規範指出，WebSocket是一個message-based的協議，它可以自動將數據分片，並且自動將分片的數據組裝。
也就是說，WebSocket的RFC標準是不會產生粘包(sticky)、半包(half a pack)問題的。無需應用層開發人員關心緩存以及手工組裝message。WebSocket API中提供的message響應就是一個完整的消息。
但是需要注意的是，由於各個WebSocket庫對RFC規範實現的良莠不齊，有些庫還是會有一些莫名問題，需要自己甄別。特別是當你的數據message特別大的時候（到底是多大是特別大，由具體實現決定）。
轉載自：https://blog.csdn.net/iningwei/article/details/100106243
nodejs集成WebSocket
nodejs中最常用的WebSocket庫ws託管在git上https://github.com/websockets/ws
api文檔爲：https://github.com/websockets/ws/blob/master/doc/ws.md
安裝方法：
服務器項目目錄Server下執行 npm install ws
會在node_modules目錄下添加ws和async-limiter文件夾。
繼續執行 npm install @types/ws,會在node_modules/@types目錄下添加ws文件夾，其內爲ws模塊的聲明文件。
WebSocket數據類型
WebSocket數據傳輸類型只支持文本類型和二進制類型。二進制支持Blob和ArrayBuffer兩種類型。二進制默認是Blob類型。
// 設置二進制數據類型爲blob（默認類型）
ws.binaryType = "blob";
// Event handler for receiving Blob messages
ws.onmessage = function(e) {
if(e.data instanceof Blob){
console.log("Blob message received", e.data);
var blob = new Blob(e.data);
}
};
//ArrayBuffer
ws.binaryType = "arraybuffer";
ws.onmessage = function(e) {
if(e.data instanceof ArrayBuffer){
console.log("ArrayBuffer Message Received", + e.data);
// e.data即ArrayBuffer類型
var a = new Uint8Array(e.data);
}
};
寫一個簡單的WebSocket服務器
打開index.ts，複製以下內容：
import * as WebSocket from "ws"
const server = new WebSocket.Server({ port: 8083 });
server.on("listening", () => {
console.log("服務器啓動完畢！開始偵聽");
});
server.on("connection", function connection(ws) {
ws.on("message", function incoming(message) {
console.log("received:%s", message);
});
ws.send("hhhello");
});
客戶端代碼
typescript已經封裝有WebSocket模塊，使用自帶的即可。
private ws: WebSocket;
start() {
console.log("go!");
this.ws = new WebSocket("ws://192.168.2.31:8083");
this.ws.onopen = this.onOpen.bind(this);
this.ws.onmessage = function (event) {
console.log("client rcv:" + event.data);
}.bind(this);
this.ws.onclose = function (event) {
console.log("服務器已關");
}.bind(this);
this.ws.onerror = function (event) {
}.bind(this);
}
private onOpen(event: MessageEvent) {
console.log("連接建立啦");
this.sendData(JSON.stringify({
ctype: "login",
data: {
name: "jack",
age: 22
}
}));
}
private sendData(data) {
this.ws.send(data);
}
總結
上述代碼演示了，客戶端把JSON格式的數據字符串化，傳給服務器。