dotNet Core使用SignalR实现websocket
前言:
最近有一个公司项目做一个排队叫号系统,系统功能不复杂,所以后端就我一人,难点在于消息推送到安卓屏上,最近有点时间,把我工作中使用的技术分享出来!
整个技术架构:前端使用vue uniapp,后端使用dotNet core3.1,数据库是Sqlserver,ORM框架是SqlSuagar,中间件有log4net,Newtonsoft.Json,
Microsoft.AspNet.SignalR.Core。
当然我们在使用一个自己以前没使用的技术时都是先写一个demo,那么我今天就给大家分享我写的demo!
首先我们新建一个dotNet Core3.1程序
然后我们打开Nuget包管理器,搜索SignalR安卓最新的稳定版本1.1.0
然后我们新建一个文件夹,用来存放我们新建的SignalR自定义集线器,代码如下!
public class ChatHub : Hub { ////// 这里的方法是给前端调用的 /// /// /// /// public async Task SendMessage(string user, string message) { await Clients.All.SendAsync("ReceiveMessage", user, message); } ? /// /// 连接成功 /// /// public override async Task OnConnectedAsync() { await Clients.All.SendAsync("Connected", "连接成功[来至服务器的信息]"); } } ?
然后我们在StartUp类的ConfigureServices方法中配置Signalr,配置跨域,代码如下!
public void ConfigureServices(IServiceCollection services) { services.AddControllers(); ? services.AddCors(options => options.AddPolicy("CorsPolicy", builder => { builder.AllowAnyMethod() .AllowAnyHeader() .SetIsOriginAllowed(o => true) .AllowCredentials(); })); services.AddSignalR(); }
最后我们在StartUp类的Configure方法中使用Signalr,使用我们自定义的集线器ChatHub,代码如下!
public void Configure(IApplicationBuilder app, IWebHostEnvironment env) { if (env.IsDevelopment()) { app.UseDeveloperExceptionPage(); } ? app.UseRouting(); ? app.UseAuthorization(); app.UseCors("CorsPolicy"); app.UseEndpoints(endpoints => { endpoints.MapHub("/chathub"); //设置长连接地址 endpoints.MapControllers(); }); }
这样我们服务端就搭建好了,当然搭建好之后我们需要自己写个前端代码验证自己的WebSocket服务是否搭建成功!
客户端代码 打开Vscode 新建WebSocket.html
我们在head标签内链接外部Signalr JS外部资源文件,代码如下!
然后写一个简单的发送消息界面
"app">class="view">"text" v-model="name" placeholder="输入名称" />"primary" @click="send">发送消息
html代码
js代码
关注gzh【黑哥聊dotNet】获取项目源码