NetCore WebSocket即时通讯示例

时间：2021-09-04 来源：互联网编辑：宝哥软件园浏览：次

NetCore网络套接字即时通讯示例，供大家参考，具体内容如下

1.新建网络核心网项目

2.创建简易通讯协议

公共类MsgTemplate { public string SenderID { get；设置；}公共字符串接收rID { get设置；}公共字符串MessageType { get设置；}公共字符串内容{获取设置；} }SenderID发送者身份

接收接受者身份

消息类型消息类型文本语音等等

内容消息内容

3.添加中间件ChatWebSocketMiddleware

公共类ChatWebSocketMiddleware {私有静态并发字典字符串，系统.净。web套接字。web sockets _ sockets=new concurrentdictionary string，System .净。网络套接字。WebSocket()；私有只读请求委托_ nextpublic ChatWebSocketMiddlWare(RequestDelegate next){ _ next=next；}公共异步任务调用(HttpContext上下文){ if(！语境网络套接字。IsWebSocketRequest){ wait _ next .调用(上下文);返回；}系统. Net。网络套接字虚拟；CancellationToken ct=上下文。请求中止；var currentSocket=等待上下文web套接字。AcceptWebSocketAsync()；//字符串socketId=Guid .NewGuid().ToString()；字符串socketId=上下文。请求。查询['sid'].ToString()；if(！_套接字包含KeY(SocketTid)){ _ Sockets .TryAdd(socketId，CurrentScket)；}//_套接字。尝试移除(socketId，out假人)；//_套接字. TryAdd(socketId，CurrentScket)；while (true) { if (ct .iscancelingrequested){ break；}字符串响应=wait receivestringsync(当前数据包，CT)；MsgTemplate msg=JsonConvert .反序列化对象模板（响应);如果(字符串IsNullOrEmpty(响应)){ if(当前数据包.状态！=网络套接字状态.open){ break；}继续；} foreach(var socket in _ sockets){ if(socket .价值。国家！=网络套接字状态.open){ continue；} if(插座.Key==msg .接收|套接字key==Sockettid){ await SendStringAsync(套接字。值，JsonConvert .SerializeObject(msg，CT)；} } }//_套接字。尝试移除(socketId，out假人)；等待当前数据包CloseAsync(WebSocketclosestatus .正常关闭，"关闭“，CT)；当前数据包.dispose()；}私有静态任务发送字符串同步（系统. Net。网络套接字套接字，字符串数据，cancelationtoken CT=默认值(cancelationtoken)){ var buffer=Encoding .UTF8。GetBytes(数据);var segment=新的ArraySegmentbyte(缓冲区);返回插座发送异步(段，WebSocketMessageType .文字，真，CT)；}私有静态异步任务字符串接收字符串同步（系统. Net。WebSockets.WebSocket socket，cancelatitoken CT=default(cancelatitoken)){ var buffer=new ArraySegmentbyte(new byte[8192])；使用(var ms=new memory stream()){ WebSocket received result结果；做{ ct .throwifcancelationrequested()；结果=等待套接字接收异步(缓冲区，CT)；写缓冲区。数组，缓冲区。偏移，结果。计数);} while(！结果EndOfMessage)；Seek女士(0，SeekOrigin .开始);如果(结果消息类型！=WebSocketMessageType .文本){ 0返回null}使用(var reader=新StreamReader(毫秒，编码. UTF8){ }返回等待阅读器ReadToEndAsync()；} } } }控制只有接收者才能收到消息

如果(插座密钥==消息.接收|套接字key==Sockettid){ await SendStringAsync(套接字。值，JsonConvert .SerializeObject(msg，CT)；}4.在Startup.cs中使用中间件

应用程序.UseWebSockets()；应用程序.UseMiddlewareChatWebSocketMiddleware()；5.建立移动端测试示例这里采用离子3运行在网端

创建离子3项目略过新手可点这里查看或者有Angular2/4项目竟然可直接往下看

(1) 启动离子的项目

当初创建离子3项目时候遇到不少问题

比如离子硬币指示器（coin-levelindicator的缩写）命令行界面（Command Line Interface for batch scripting）初始化项目失败切换到默认npmorg源就好了

比如离子发球失败打开代理允许会计季度(财政季度)就好了

启动后界面是这样式的

(2) 创建聊天窗口对话具体布局实现模块加载略过直接进入websocket实现

在这之前别忘了启动网项目否则会出现这样情况链接不到服务

(3)对话具体实现

导出类对话框{ private ws: any二等兵msgArr: Arrayany构造函数（私有HttpServiCe : HttpServiCe){ this。MSgarr=[]；} ionviewdenter(){ if(！这个。ws){这个。ws=new WebSocket(' ws ://localhost :56892？sid=222 ')；这个。ws。onopen=()={ console。日志(“打开”)；};这个。ws。on message=(事件)={ console。日志('新消息： '事件。数据)；var msgObj=JSON。解析(事件。数据)；这个。MsGarr。push(MsGobj)；};这个。ws。onerror=()={控制台。日志('出错!');};this.ws.onclose=(事件)={控制台。日志('关闭代码='事件。代码')；};} } sendMsg(msg) {//msg为我要发送的内容比如hello world ' var msgObj={ senderid : ' 222 '，ReceiverID: '111 '，MessageType: 'text '，content : msg }；这个。ws。发送(JSON。stringify(msgObj))；}ws://localhost:56892？sid=222这是websocke服务链接地址（同突发球形干扰)电离层的突然骚扰表示着我这个端的web套接字唯一标识找到这个键就可以找到我这个用户端了

6.在网端也实现一个会话窗口

div class=' container ' style=' width :90%；余量：0px汽车；'border:1px实心钢蓝色；div class=' msg ' div id=' msgs ' style=' height :200 px；/div/div style=' display : block；宽度：100%”输入类型="文本"样式="最大宽度： unset宽度：100%;最大宽度：100% ' id=' MessageField '占位符='键入消息并按输入///div脚本$(function(){ $().导航条-默认值')。添加CLaSS(' on ')；var userName=" @ Modelvar协议=位置。协议===' https : '？WSS : ' : ' ws : var WSURi=protocol '//'窗口。位置。主持人？sid=111 '；var socket=new WebSocket(WSURi)；插座。onopen=e={ console。log(' socket open '，e)；};插座。onclose=function(e){ console。log(' socket closed '，e)；};插座。on消息=函数(e){控制台。日志(e)；var msgObj=JSON。解析(例如数据)；$('#msgs ').追加(msgObj .内容br/')；};插座。onerror=函数(e){控制台。错误(如数据)；};$('#MessageField ').按键（函数{如果(什么！=13) {返回；} e . PreventDefault()；var message=$(“# MessageField”).val()；var msgObj={ SenderID:'111 '，ReceiverID:'222 '，MessageType: 'text '，content : message }；插座。发送(JSON。stringify(msgObj))；$('#MessageField ').val(" ")；});});/script基本开发完成接下来看看效果

7 .网络和webapp端对话