webSocket在.net中的使用案例-编程知识

webSocket在.net中的使用案例

news/2025/2/27 14:14:29/文章来源:https://www.cnblogs.com/chenxizhaolu/p/18740868

前言

　　前面asp.net实现长连接 - chenxizhaolu - 博客园学习了如何在asp.net中实现http长连接，这里继续学习websocket。

　　WebSockets 是一种协议，它能让客户端和服务器之间通过单个长期连接进行无缝通信。与 HTTP 等遵循请求-响应模式的传统网络通信方法不同，WebSockets 引入了全双工通信通道。这意味着客户端和服务器可以同时发送和接收数据，从而实现即时更新和实时交互。

　　WebSockets 常用于需要实时数据更新的场景。例如，多人游戏大厅聊天、实时通知、股票市场数据馈送和实时协作工具。这些应用需要即时通信和数据交换，而 WebSockets 恰好能提供这些功能。

创建服务端程序

var builder = WebApplication.CreateBuilder(args);
builder.WebHost.UseUrls("http://localhost:5000");
var app = builder.Build();
app.UseWebSockets();
//收到消息后回应
app.Map("/ws", async context =>
{if (context.WebSockets.IsWebSocketRequest){using (var webSocket = await context.WebSockets.AcceptWebSocketAsync()){_ = Task.Run(async () =>{while (true){var message = "服务器心跳推送当前时间：" + DateTime.Now.ToLongTimeString();var buffer = Encoding.UTF8.GetBytes(message);var segment = new ArraySegment<byte>(buffer);await webSocket.SendAsync(segment, WebSocketMessageType.Text, true, CancellationToken.None);Thread.Sleep(3000);}});var buffer = new byte[1024 * 4];WebSocketReceiveResult result = await webSocket.ReceiveAsync(new ArraySegment<byte>(buffer), CancellationToken.None);var clientMsg = Encoding.UTF8.GetString(buffer, 0, result.Count);while (!result.CloseStatus.HasValue){var replayMessage = Encoding.UTF8.GetBytes("服务器收到了客户端的信息：" + clientMsg);await webSocket.SendAsync(new ArraySegment<byte>(replayMessage), WebSocketMessageType.Text, result.EndOfMessage, CancellationToken.None);result = await webSocket.ReceiveAsync(new ArraySegment<byte>(buffer), CancellationToken.None);}await webSocket.CloseAsync(result.CloseStatus.Value, result.CloseStatusDescription, CancellationToken.None);Console.WriteLine("WebSocket 连接已关闭");}}else{context.Response.StatusCode = (int)HttpStatusCode.BadRequest;}
});await app.RunAsync();

创建html客户端

var builder = WebApplication.CreateBuilder(args);
var app = builder.Build();
app.UseStaticFiles();
app.Run();

<body><h1>WebSocket 示例</h1><div><input type="text" id="messageInput" placeholder="输入消息"><button id="sendButton">发送</button></div><ul id="messages"></ul><script>// 创建 WebSocket 连接const ws = new WebSocket('ws://localhost:5000/ws');// 监听连接打开事件ws.onopen = () => {console.log('已连接到 WebSocket 服务器');appendMessage('服务器', '连接已建立');};// 监听服务器发送的消息ws.onmessage = (event) => {const message = event.data;console.log('收到服务器消息:', message);appendMessage('服务器', message);};// 监听连接关闭事件ws.onclose = () => {console.log('WebSocket 连接已关闭');appendMessage('服务器', '连接已关闭');};// 监听连接错误事件ws.onerror = (error) => {console.error('WebSocket 错误:', error);appendMessage('服务器', '连接错误');};// 发送消息document.getElementById('sendButton').addEventListener('click', () => {const message = document.getElementById('messageInput').value;if (message) {ws.send(message); // 向服务器发送消息appendMessage('我', message);document.getElementById('messageInput').value = '';}});// 在页面上显示消息
        function appendMessage(sender, message) {const li = document.createElement('li');li.textContent = `${sender}: ${message}`;document.getElementById('messages').appendChild(li);}</script>
</body>