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代码如下:

using Fleck;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace WebSocketConsole
{
    class Program
    {
        static void Main(string[] args)
        {
            FleckLog.Level = LogLevel.Debug;
            var allSockets = new List<IWebSocketConnection>();
            var server = new WebSocketServer("ws://0.0.0.0:7080");
            server.Start(socket =>
            {
                socket.OnOpen = () =>
                {
                    Console.WriteLine("客户端连接成功!");
                    allSockets.Add(socket);
                    Console.WriteLine("当前客户端数量:"+allSockets.ToList().Count);
                };
                socket.OnClose = () =>
                {
                    Console.WriteLine("客户端已经关闭!");
                    allSockets.Remove(socket);
                    Console.WriteLine("当前客户端数量:" + allSockets.ToList().Count);
                };
                //收到消息时
                socket.OnMessage = message =>
                {
                    Console.WriteLine(message);
                    allSockets.ToList().ForEach(s => s.Send(message));
                };
            });

            //读取输入消息
            var input = Console.ReadLine();
            //当消息不为“exit"时,则进入死循环
            while (input != "exit")
            {
                //遍历所有的socket客户端,给每个客户端发送消息
                foreach (var socket in allSockets.ToList())
                {
                    socket.Send(input);
                }
                input = Console.ReadLine();
            }

        }
    }
}

编译没有问题,成功,

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

 

选择

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body> 
    <div>发送消息:</div>
    <input type="text" id="msgContent" />
    <input type="button" value="点我发送" onclick="CHAT.chat()" /> 
    <div>接受消息:</div>
    <div id="receiveMsg" style="background-color: gainsboro;"></div> 
    <script type="application/javascript">

        window.CHAT = {
            socket: null,
            init: function() {
                if (window.WebSocket) {
                    CHAT.socket = new WebSocket("ws://127.0.0.1:7080/ws");//websocket服务器地址及端口
                    CHAT.socket.onopen = function() {
                        console.log("连接建立成功...");
                    },
                    CHAT.socket.onclose = function() {
                        console.log("连接关闭...");
                    },
                    CHAT.socket.onerror = function() {
                        console.log("发生错误...");
                    },
                    CHAT.socket.onmessage = function(e) {
                        console.log("接受到消息:" + e.data);
                        var receiveMsg = document.getElementById("receiveMsg");
                        var html = receiveMsg.innerHTML;
                        receiveMsg.innerHTML = html + "<br/>" + e.data;
                    }
                } else {
                    alert("浏览器不支持websocket协议...");
                }
            },
            chat: function() {
                var msg = document.getElementById("msgContent");
                CHAT.socket.send(msg.value);
            }
        };

        CHAT.init();

    </script>
</body>


</html>

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

 

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

 8、

 网页输入消息

 

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

 

 

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

  • 17
    点赞
  • 56
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

hqwest

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值