当前位置:   article > 正文

C# 实现 Websocket通讯聊天 (管用、超好使,点个赞)_c# websocket

c# websocket

1、背景

WebSocket出现之前,Web端为了实现即时通讯,所用的技术都是Ajax轮询(polling)。轮询是在特定的的时间间隔(如每1秒),由浏览器对服务器发出HTTP request,然后由服务器返回最新的数据给客服端的浏览器。这种传统的HTTP request 的模式带来很明显的缺点 – 浏览器需要不断的向服务器发出请求,然而HTTP request 的header是非常长的,里面包含的数据可能只是一个很小的值,这样会占用很多的带宽。而比较新的技术去做轮询的效果是Comet , 但这种技术虽然可达到全双工通信,依然需要发出请求。

2、介绍

Web Sockets没有什么神奇之处,首先要意识到该协议本质上是一个基本的双工TCP/IP套接字连接。连接从客户端连接到远程服务器并将HTTP标头文本发送到该服务器开始。标头文本要求Web服务器将连接升级为Web套接字连接。这是作为握手完成的,Web服务器使用适当的HTTP文本标头进行响应,从那时起,客户端和服务器将使用Web Socket语言。

3、WebSocket 技术概览

在 WebSocket API,浏览器和服务器只需要要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送,改变了原有的B/S模式。WebSocket的技术原理:

WebSocket的技术原理:

4、C# websocket及时通信协议的实现

Websocket有java、nodejs、python、PHP、等版本 ,哪些浏览器支持websocket:

 

 我现在使用的是C#版本,服务器端是Fleck。客户端和服务器端来使用websocket的,下面开始讲解如何使用:

接下来我们使用的是C#控制台程序来实现

1、打开vs2019,创建空项目

 2、

 

 3、添加控制台项目

 4、引入fleck

 Fleck是C#中的一个WebSocket服务器实现。Program.cs代码如下:

  1. using Fleck;
  2. using System;
  3. using System.Collections.Generic;
  4. using System.Linq;
  5. using System.Text;
  6. using System.Threading.Tasks;
  7. namespace WebSocketConsole
  8. {
  9. class Program
  10. {
  11. static void Main(string[] args)
  12. {
  13. FleckLog.Level = LogLevel.Debug;
  14. var allSockets = new List<IWebSocketConnection>();
  15. var server = new WebSocketServer("ws://0.0.0.0:7080");
  16. server.Start(socket =>
  17. {
  18. socket.OnOpen = () =>
  19. {
  20. Console.WriteLine("客户端连接成功!");
  21. allSockets.Add(socket);
  22. Console.WriteLine("当前客户端数量:"+allSockets.ToList().Count);
  23. };
  24. socket.OnClose = () =>
  25. {
  26. Console.WriteLine("客户端已经关闭!");
  27. allSockets.Remove(socket);
  28. Console.WriteLine("当前客户端数量:" + allSockets.ToList().Count);
  29. };
  30. //收到消息时
  31. socket.OnMessage = message =>
  32. {
  33. Console.WriteLine(message);
  34. allSockets.ToList().ForEach(s => s.Send(message));
  35. };
  36. });
  37. //读取输入消息
  38. var input = Console.ReadLine();
  39. //当消息不为“exit"时,则进入死循环
  40. while (input != "exit")
  41. {
  42. //遍历所有的socket客户端,给每个客户端发送消息
  43. foreach (var socket in allSockets.ToList())
  44. {
  45. socket.Send(input);
  46. }
  47. input = Console.ReadLine();
  48. }
  49. }
  50. }
  51. }

编译没有问题,成功,

5、解决方案上添加新项目

 

选择

 项目名称取名为:SocketWebClient,然后添加html网页,名称WebChatPage.html,内容如下:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <title></title>
  6. </head>
  7. <body>
  8. <div>发送消息:</div>
  9. <input type="text" id="msgContent" />
  10. <input type="button" value="点我发送" onclick="CHAT.chat()" />
  11. <div>接受消息:</div>
  12. <div id="receiveMsg" style="background-color: gainsboro;"></div>
  13. <script type="application/javascript">
  14. window.CHAT = {
  15. socket: null,
  16. init: function() {
  17. if (window.WebSocket) {
  18. CHAT.socket = new WebSocket("ws://127.0.0.1:7080/ws");//websocket服务器地址及端口
  19. CHAT.socket.onopen = function() {
  20. console.log("连接建立成功...");
  21. },
  22. CHAT.socket.onclose = function() {
  23. console.log("连接关闭...");
  24. },
  25. CHAT.socket.onerror = function() {
  26. console.log("发生错误...");
  27. },
  28. CHAT.socket.onmessage = function(e) {
  29. console.log("接受到消息:" + e.data);
  30. var receiveMsg = document.getElementById("receiveMsg");
  31. var html = receiveMsg.innerHTML;
  32. receiveMsg.innerHTML = html + "<br/>" + e.data;
  33. }
  34. } else {
  35. alert("浏览器不支持websocket协议...");
  36. }
  37. },
  38. chat: function() {
  39. var msg = document.getElementById("msgContent");
  40. CHAT.socket.send(msg.value);
  41. }
  42. };
  43. CHAT.init();
  44. </script>
  45. </body>
  46. </html>

6、在WebSocketConsole上找到生成的文件路径,即项目的debug目录

 

 7、将SocketWebClient设为启动项目,运行html页面

 8、

 网页输入消息

 

 9、再用另一个浏览器edge打开网页,输入消息

 

 

 websocket管用,好使,拈,扛把子。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/Monodyee/article/detail/107338
推荐阅读
相关标签
  

闽ICP备14008679号