C#websocket及时通信协议的实现⽅法⽰例
传统“长轮询”实现Web端即时通讯的问题
WebSocket出现之前,Web端为了实现即时通讯,所⽤的技术都是Ajax轮询(polling)。轮询是在特定的的时间间隔(如每1秒),由浏览器对服务器发出HTTP request,然后由服务器返回最新的数据给客服端的浏览器。这种传统的HTTP request 的模式带来很明显的缺点 – 浏览器需要不断的向服务器发出请求,然⽽HTTP request 的header是⾮常长的,⾥⾯包含的数据可能只是⼀个很⼩的值,这样会占⽤很多的带宽。
⽽⽐较新的技术去做轮询的效果是Comet , 但这种技术虽然可达到全双⼯通信,依然需要发出请求。
WebSocket 技术概览
在 WebSocket API,浏览器和服务器只需要要做⼀个握⼿的动作,然后,浏览器和服务器之间就形成了⼀条快速通道。两者之间就直接可以数据互相传送,改变了原有的B/S模式。
WebSocket技术应⽤的典型架构:
WebSocket的技术原理:
介绍了基础知识,下⾯开始本⽂的正⽂内容:
C# websocket及时通信协议的实现
1:Websocket有java、nodejs、python、PHP、等版本,我现在使⽤的是C3版本,服务器端是Fleck。客户端和服务器端来使⽤websocket的,下⾯开始讲解如何使⽤:
2:在开始之前我们先来看看哪些浏览器⽀持websocket:
Websocket服务器⽀持:
3:接下来我们使⽤的是C#控制台程序来实现客户端直接通信的实施推送第⼀步服务器端:
打开VS2015 创建项⽬Webshoufa(如下图)
服务器端⽰例展⽰:
打开主程序⼊库Program.CS
写⼊主要链接推送代码如下展⽰
FleckLog.Level = LogLevel.Debug;
var allSockets = new List<IWebSocketConnection>();
var server = new WebSocketServer("ws://0.0.0.0:7181");
server.Start(socket =>
{
socket.OnOpen = () =>
{
Console.WriteLine("Open!");
allSockets.Add(socket);
};
socket.OnClose = () =>
{
Console.WriteLine("Close!");
allSockets.Remove(socket);
};
socket.OnMessage = message =>
{
Console.WriteLine(message);
allSockets.ToList().ForEach(s => s.Send("Echo: " + message));
};
});
以上代码:尤为重要的注意【Fleck】我们此次实例中服务端使⽤的是Fleck如下解释:
Fleck是C#中的⼀个WebSocket服务器实现。从项⽬分⽀出来,Fleck不需要继承,容器或其他引⽤。代码⽰例如下(以下是⼀个将回显给客户端的例⼦。),在实现之前.NET平台必须是在4.5之上才能运⾏,
上⾯开始已经提到。例⼦中定义引⽤WebSocketServer服务写⼊端⼝路劲,格式⽅法是固定的。参照写⼊即可。
实例代码1如下
var server = new WebSocketServer("ws://localhost:7181");
server.Start(socket =>
{
socket.OnOpen = () => Console.WriteLine("Open!");
socket.OnClose = () => Console.WriteLine("Close!");
socket.OnMessage = message => socket.Send(message);
});
实例代码2如下(安全秘钥版)
ar server = new WebSocketServer(“ wss://0.0.0.0:8431 ”);
server.Certificate = new X509Certificate2(“ MyCert.pfx ”);
server.Start(socket =>
{
// ...⽤法正常
});
开始触发server.Start业务输出代码,以上两部分实例代码输出⼀样的区别在于启⽤安全连接需要两件事情:使⽤该⽅案wss代替ws,并将Fleck指向包含公钥和私钥的x509证书。
接下来写⼊触发键盘响应代码:如下所⽰
var input = Console.ReadLine();
while (input != "exit")
{
foreach (var socket in allSockets.ToList())
{
socket.Send(input);
}
input = Console.ReadLine();
}
代码解析:上述定义input =Console.ReadLine();由第⼀段输出参数
在input不为空的情况下给予下⼀次事件发⽣。
在此完成服务器端⽰例开发。
客户端页⾯请求端展⽰(浏览器端)
1:新建客户端项⽬,以web页⾯或者webform页⾯均可。
2:我的⽰例是以webform来创建如下图展⽰:
在此,我们只实现数据实时交互展⽰,如需要数据存储业务,需要在进⾏后台编码。
3:前段代码展⽰:
JS详解部分
<script type="text/javascript">
var start = function () {
var inc = ElementById('incomming');
var wsImpl = window.WebSocket || window.MozWebSocket;
var form = ElementById('sendForm');
var input = ElementById('sendText');
inc.innerHTML += "connecting to server ..<br/>";
// 创建新的websocket新连接端⼝为7181
window.ws = new wsImpl('ws://localhost:7181/');
// 当数据从服务器服务中⼼发送后,继续向下运⾏过程
inc.innerHTML += evt.data + '<br/>';
};
// 当链接对象到服务端成功对接后,提⽰正常打开
inc.innerHTML += '.. connection open<br/>';
};
/
/ 当链接对象未到服务端成功对接后,提⽰打开失败,别切单项关闭
inc.innerHTML += '.. connection closed<br/>';
}
form.addEventListener('submit', function (e) {
e.preventDefault();
var val = input.value;
ws.send(val);
input.value = "";
});
}
</script>
注意:以上⽰例代码⽚段中window.ws = new wsImpl('ws://localhost:7181/');中ws关键定义。
启⽤安全连接需要两件事情:使⽤该⽅案wss代替ws,并将Fleck指向包含公钥和私钥的x509证书。并使⽤load = start;函数。
注意:
⼀.将脚本代码放在⽹页的底端,这样在运⾏脚本代码的时候,可以确保要操作的对象已经加载完成。⼆.通过load来执⾏脚本代码。
有需要了解load在JS中函数中的⽤法详细可参考:
第⼆段代码:调⽤控件实体进⾏事件触发:
<body>
<form id="sendForm">
<input id="sendText" placeholder="Text to send" />
</form>
<pre id="incomming"></pre>
writeline教程</body>
以上是客户端web页⾯访问进⾏实施数据推送的页⾯开发完成。
好了,到了这⾥将两个项⽬⽣成⽆误之后逐个启动不分顺序,注意需要都启动⽅可进⾏测试验证:如下图效果。
启动客户端页⾯和控制台程序(然后刷新下客户端页⾯即可)
在客户端和服务器端交互时输⼊:你好,⾼峰或者XXXX信息,⼏乎在零误差时间内服务器端收到数据。然后也可在服务器端窗⼝输⼊信息,例如:你是不是要去阿拉善出差?
成功了,呵呵,是不是很神奇,现在可以添加⾃⼰喜欢的接⼝业务逻辑在⾥⾯了,是不是觉得前后台通信变得简单了?强不强⼤?爽不爽
Ok,到此我们就结束了这⾥的教程,此次重点讲述了以下两点开发组套,⼤家在开发过程中尤为重视:
1:.NET 4.5 添加了WebSocket
2:服务端:
var listener = new HttpListener();
listener.Prefixes.Add("*:8080/");
listener.Start();
var context = await listener.GetContextAsync();
var wsContext = await context.AcceptWebSocketAsync(null);
var ws = wsContext.WebSocket;
3:客户端:
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论