宝哥软件园

微信小程序与以太网核心信号聊天实例

编辑:宝哥软件园 来源:互联网 时间:2021-12-07

本文不对小程序与信号员做任何介绍,默认读者已经掌握

aspnetcore信号文档小程序文档

写在之前

信号装置没有提供小程序使用的客户端js,所以本人参考signlar.js写了小程序版发信号给客户。射流研究…代码开源,地址https://github.com/liangshiw/SignalRMiniProgram-Client

先上效果图

微信小程序与AspNetCore  SignalR聊天实例(图1)

微信小程序与AspNetCore  SignalR聊天实例(图2)

微信小程序与AspNetCore  SignalR聊天实例(图3)

开始编码

首先需要创建一个aspnetcore的mvc项目,创建完成后我们需要安装signalr的包

微软安装包。信号现在就可以创建中心集线器了,首先定义一个类来描述已在线的用户,它需要头像和姓名

公共类OnlineClient{公共字符串昵称{获取设置;}公共字符串头像{ get设置;}}接下来我们在连接创建时,把当前用户做为在线用户添加到字典中,向该用户发送加入成功的系统消息。并且同时向其他的用户发送系统消息

公共覆盖异步任务onConnectedSync(){ var http=Context .GetHttpContext();var client=new OnLine client(){ NickT=http .请求。查询['昵称'],头像=http .请求。查询['头像']};锁定(同步对象){在线客户端[上下文.ConnectionId]=客户端;}等待基地onConnectedAsync();等待团体. AddToGroupAsync(上下文. ConnectionId,ChatName);等待客户群组除了(聊天名称,新[] {上下文.ConnectionId }).SendAsync(“”系统',$ '用户{客户端。昵称}加入了群聊');等待客户。客户端(上下文连接标识).SendAsync(“”系统',$ '成功加入{ ChatName } ');}同样在用户断开连接时做离线处理

公共覆盖异步任务在连接同步(异常异常){等待基础OnDisconnectedAsync(异常);bool isRemovedOnlineClient客户端;lock(SyncObj){ IsRemoved=OnLineClients .尝试移除(上下文连接标识,输出客户端);}等待群组. RemoveFromGroupAsync(上下文. ConnectionId,ChatName);if(IsRemoved){ 0等待客户端群组除了(聊天名称,新[] {上下文.ConnectionId }).SendAsync(“”系统',$ '用户{客户端。昵称}退出了群聊');}} 下面就只有一个简单的发送消息方法了,首先查看当前用户是否在线并做相应处理,如果在线就把当前用户的消息和头像姓名一起发送给组中的其他客户端

公共异步任务发送消息(字符串msg){ var client=OnlineClients .其中(x=x .键==上下文.ConnectionId ).选择(x=x。值)。first ordefault();如果(客户端==空){等待客户端.客户端(上下文连接标识).SendAsync(“”系统','您已不在聊天室,请重新加入');} else {等待客户群组除了(聊天名称,新[] {上下文.ConnectionId }).SendAsync('receive '),新的{ msg,NiCKET=client .昵称,头像=客户端。头像});}}在小程序中,我们需要在页面加载事件中创建与信号员的连接,并且注册系统系统消息与接收用户消息两个方法以接收服务端发来的消息

onLoad:函数(选项){ this.hubConnect=新的Hub .集线器连接();这个。HubConnect。开始(' https://聊天。劲松在线。网络/聊天',{ 0昵称: app。全球数据。用户信息。NiCKET,头像:应用。全球数据。用户信息。avatar URL });这个。HubConnect。onopen=RES={ console。日志('成功开启连接)} this.hubConnect.on('system ',res={ wx.showModal({ title: '系统消息,content: res,})})这一点。HubConnect。on(' receive ',RES={ cente data。推送({ content : RES . msg,time: new Date().toLocaleString(),head_owner: res.avatar,is _ show _ right : { 0 });这个。setdata({ cente data : cente data })})同样在页面销毁时应断开与信号员服务器的连接

Unload:函数(){this。hub connect . close({ reason : ' exit ' })}发送方法也很简单。只需调用sendMessage方法并传入用户输入的消息,就完成了。剩下的就是页面上的处理了。

this . HubConnect . send(' send message ',message);需要注意的是,打开小程序代码时,请修改project.config.json文件中的appid,项目好的话请跟我来。

更多资讯
游戏推荐
更多+