在IIS上搭建WebSocket服務器（三）
阿新 • • 發佈：2017-08-03
復制代碼 .ashx class ctype pen maximum charset ash too 
編寫客戶端代碼
1.新建一個*.html文件。
ws = new WebSocket(‘ws://192.168.85.128:8086/Handler1.ashx?user=‘ + $("#user").val());
這個地方的IP和端口號對應著我們搭建在IIS上的WebSocket服務器
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"/>
<title></title>
<script src="http://code.jquery.com/jquery-1.4.1.min.js"></script>
<script>
var ws;
$().ready(function () {
$(‘#conn‘).click(function () {
//ws = new WebSocket(‘ws://‘ + window.location.hostname + ‘:‘ + window.location.port + ‘/Handler1.ashx?user=‘ + $("#user").val());
ws = new WebSocket(‘ws://192.168.85.128:8086/Handler1.ashx?user=‘ + $("#user").val());
//var host = ‘ws://192.168.85.128:8085/api/WSChat?user=‘+$("#user").val();
//var host = "ws://192.168.85.128:8085/api/WSChat";
//webSocket = new WebSocket(host);
$(‘#msg‘).append(‘<p>正在連接</p>‘);
ws.onopen = function () {
$(‘#msg‘).append(‘<p>已經連接</p>‘);
}
ws.onmessage = function (evt) {
$(‘#msg‘).append(‘<p>‘ + evt.data + ‘</p>‘);
}
ws.onerror = function (evt) {
$(‘#msg‘).append(‘<p>‘ + JSON.stringify(evt) + ‘</p>‘);
}
ws.onclose = function () {
$(‘#msg‘).append(‘<p>已經關閉</p>‘);
}
});
$(‘#close‘).click(function () {
ws.close();
});
$(‘#send‘).click(function () {
if (ws.readyState == WebSocket.OPEN) {
ws.send($("#to").val() + "|" + $(‘#content‘).val());
}
else {
$(‘#tips‘).text(‘連接已經關閉‘);
}
});
});
</script>
</head>
<body>
<div>
<input id="user" type="text" />
<input id="conn" type="button" value="連接" />
<input id="close" type="button" value="關閉"/><br />
<span id="tips"></span>
<input id="content" type="text" />
<input id="send" type="button" value="發送"/><br />
<input id="to" type="text" />目的用戶
<div id="msg">
</div>
</div>
</body>
</html>
2.客戶端A和客戶端B通信效果
在瀏覽器中分別打開兩個窗口，左邊為客戶端A，右邊為客戶端B，點擊“連接”按鈕，AB客戶端分別與服務器建立連接
填寫要發送的內容，即可看到A和B互相發送的信息了，即實現了AB客戶端實現了WebSocket即時通信。
在IIS上搭建WebSocket服務器（三）