WebSocket 客戶端測試功能
websocket是有標准的通信協議，在h2engine服務器引擎中繼承了websocket通信協議，使用websocket通信協議的好處是很多語言或框架都內置了websocket的支持，工具也非常多，可以非常方便的測試。比如在邏輯開發過程中，有時候協議定好了，但是由於客戶端還沒有及時完成相應功能，那么如果有個模擬的客戶端就會非常的方便，這個模擬的客戶端只要能夠收發協議就好。websocket瀏覽器天然支持，所以用瀏覽器websocket實現模擬客戶端非常的方便，使用的人直接省掉了按照客戶端的麻煩，直接放到一個webserver上，所有人都能用。
WebSocket 與服務器通信實現
協議設計，websocket與h2engine服務器引擎通信，協議頭的格式是cmd:協議號(整型)\n數據,這里參考了http頭的協議設計，以\n區別協議頭和協議體，協議頭可以有多個參數，逗號分隔，這里只用了cmd，保留了其他協議參數的能力。用字符串的協議頭對js這種腳本語言更友好，更容易兼容其他語言。
var ws = undefined;
var gHost = '';
function Log(Text, MessageType) {
if (MessageType == "OK")
Text = "<span style='color: green;'>" + Text + "</span>";
else if (MessageType == "ERROR")
Text = "<span style='color: red;'>" + Text + "</span>";
else if (MessageType == "SEND")
Text = "<span style='color: orange;'>" + Text + "</span>";
document.getElementById("LogContainer").innerHTML = document.getElementById("LogContainer").innerHTML + Text + "<br />";
var LogContainer = document.getElementById("LogContainer");
LogContainer.scrollTop = LogContainer.scrollHeight;
};
function btnConnect(){
if (ws){
Log("連接已經建立!!。", "ERROR");
return;
}
gHost = document.getElementById("ip").value + ":" + document.getElementById("port").value;
Log("begin connect:"+gHost)
gHost += "/chat";
if ("WebSocket" in window) {
ws = new WebSocket("ws://" + gHost);
}
else if("MozWebSocket" in window) {
ws = new MozWebSocket("ws://" + gHost);
}
ws.onopen = WSonOpen;
ws.onmessage = WSonMessage;
ws.onclose = WSonClose;
ws.onerror = WSonError;
}
function btnClose(){
if (ws)
ws.close();
}
function WSonOpen() {
Log("連接已經建立。", "OK");
};
function btnSend(){
var cmdReq = $('#cmdSelect').val();
var dataReq = $('#dataReq').val();
var reqMsg = 'cmd:' + cmdReq + '\n'+dataReq;
ws.send(reqMsg);
}
WebSocket 基於瀏覽器實現的模擬客戶端截圖
- ip port 設置服務器ip端口
- 協議號用於填寫協議號，整型
- 協議數據這里只是作為延時只輸入字符串，這個正式的應該是根據協議號顯示不同的協議結構，然后根據結構字段分別填寫。
相關連接
更多精彩文章 http://h2cloud.org/