微信公众号:趣编程ACE

关注可了解更多的.NET日常实战开发技巧,如需源码 请公众号后台留言 源码

[如果觉得本公众号对您有帮助,欢迎关注]

前文回顾

【SignalR全套系列】之在.NetCore中实现WebSocket双工通信

【SignalR全套系列】之在.Net Core 中实现Server-Send Events消息推送

【SignalR全套系列】之在.Net Core 中实现长轮询


SignalR 的基本使用

原文链接:【SignalR全套系列】之在.Net6中实SignalR通信


简介

1.SignalR是一个微软开源的库,作用于客户端与服务端之间的相互通信。

2.前文简述的WebSocket、SSE、长轮询等三种方式,SignalR都支持,此外还能自动选择最佳的通信方式。

3.至于用途,主要是用在实时性要求较高的场景,比如:聊天、看板、发布公告等

服务端实现

新建.net6项目

编辑

1.注入SignalR所需服务

1// 注入SignalR所需服务
2builder.Services.AddSignalR();

2.注入SignalR所需服务

1// 开启静态文件  将客户端代码写入wwwroot中  防止跨域
2app.UseStaticFiles();

3.开启SignalR的路由节点

1// 开启路由节点 用来映射Signalr请求路径  
2// /custom 为自定义路径  
3// CustomHub 为Hub 类型
4app.MapHub<CustomHub>("/custom");
5// 同时支持分组请求,下篇讲解,,,,

3.自定义一个Hub类型 继承Hub

1// CustomHub:Hub 继承 Hub
2public class CustomHub:Hub<ClientData>{}

4.重写Hub 中 连接和关闭连接方法

 1        /// <summary>
2        /// 重写链接钩子
3        /// </summary>
4        /// <returns></returns>
5        public override Task OnConnectedAsync()
6        {
7            return base.OnConnectedAsync();
8        }
9
10        public override Task OnDisconnectedAsync(Exception? exception)
11        {
12            return base.OnDisconnectedAsync(exception);
13        }

5.构造函数中引入日志中间件

1// 引入日志 方便控制台输出
2private readonly ILogger<CustomHub> _logger;
3
4public CustomHub(ILogger<CustomHub> logger)
5{
6   this._logger = logger;
7}

6.编写与客户端通信方法

 1        /// <summary>
2        /// 建立通信
3        /// </summary>
4        /// <param name="data"></param>
5        public void BeginSendData(TransData data)
6        {
7            _logger.LogInformation("接受数据{0},{1}",data.id,data.message);
8        }
9
10        /// <summary>
11        /// 单一客户端调用 通信
12        /// 仅仅通知 调用的那个客户端 其余建立链接的客户端不生成通信
13        /// </summary>
14        /// <returns></returns>
15        public Task SingleClientCaller()
16        {
17            _logger.LogInformation("单独客户端调用");
18            return Clients.Caller.ClientHook(new (111,"111 客户端调用"));
19        }
20
21        /// <summary>
22        /// 所有客户端建立通信
23        /// 可通知所有的客户端
24        /// </summary>
25        /// <returns></returns>
26        public Task AllClientResponse()
27        {
28            _logger.LogInformation("通知所有的客户端");
29
30            return Clients.All.ClientHook(new(Guid.NewGuid(),"通知所有的客户端"));
31        }
32
33        /// <summary>
34        /// 指定调用  
35        /// </summary>
36        /// <returns></returns>
37        [HubMethodName("invoke")]
38        public TransData IvoData()
39        {
40            return new TransData(666,"返回invoke data");
41        }

客户端实现

1.引用js库

编辑

2.编写调用脚本

1// 初始化 路由:/custom 被路由节点捕获
2let connection = new signalR.HubConnectionBuilder()
3        .withUrl("/custom")
4        .build();

1// 开始连接 调用后台 BeginSendData 方法 成功后双方交互数据
2        connection.start().then(() => {
3        console.log("开始链接")
4        let id = parseInt(Math.random()*100);
5        connection.send('BeginSendData', {id: id, message: "链接成功了"})
6    });

 1    // 调用 SingleClientCaller 这个方法
2    const selfCall = () => connection.send('SingleClientCaller')
3
4    // 调用AllClientResponse这个方法
5    const all = () => connection.send('AllClientResponse')
6
7    // 触发后台控制器
8    const triggerFetch = () => fetch('/SendData')
9
10    // call signalR hub function from client
11    const withReturn = () => connection.invoke('invoke')
12        .then(data => console.log('ivo data', data))

1 // 后台默认触发
2    connection.on("ClientHook", data => console.log('客户端触发成功', data));
3
4    // 后台指定方法触发之后
5    connection.on("client_recive", data => console.log('后台触发成功', data));


以上便是SignalR实现客户端与服务端通信的基本方法,下篇文章将演示分组通信

更多精彩内容尽在公众号:

【SignalR全套系列】之在.Net Core 中实现SignalR实时通信的更多相关文章

  1. asp.net core 中的SignalR与web前端进行实时通信

    一.介绍 SignalR是.net 开源库,用于构建需要实时进行用户交互和数据更新的web应用,如在线聊天,游戏,天气等实时应用程序,且简化了构建实时应用的过程,包括服务端库和js端库,继承了数种常见 ...

  2. 一、在 ASP.NET Core 中使用 SignalR

    一.介绍 SignalR 是一个用于实现实时网站的 Microsoft .NET 库.它使用多种技术来实现服务器与客户端间的双向通信,服务器可以随时将消息推送到连接的客户端. https://docs ...

  3. SignalR系列教程:在MVC5中使用SignalR

    本章主要内容: 1:向MVC5添加SignaIr 2: 什么是集线器,如何创建集线器 3: 客户端通过jqery调用集线器 本文还是延续“SignaIR快速入门”中聊天室的例子进行讲解.首先我们通过V ...

  4. .net core系列之《.net core中使用MySql以及Dapper》

    当我们决定使用.Net Core开发的时候,就放弃使用SqlServer的打算吧.那应该选择哪个数据库呢?一般选择MySql的比较多. 接下来我们来演示在.Net Core中使用MySQL吧. 1.原 ...

  5. 【asp.net core 系列】14 .net core 中的IOC

    0.前言 通过前面几篇,我们了解到了如何实现项目的基本架构:数据源.路由设置.加密以及身份验证.那么在实现的时候,我们还会遇到这样的一个问题:当我们业务类和数据源越来越多的时候,我们无法通过普通的构造 ...

  6. 在 ASP.NET Core 中使用 SignalR

    https://weblogs.asp.net/ricardoperes/signalr-in-asp-net-core 作者:Ricardo Peres 译者:oopsguy.com 介绍 Sign ...

  7. .net core系列之《.net core中使用集成IDistributedCache接口的Redis和MongoDB实现分布式缓存》

    分布式的缓存可以提高性能和可伸缩性的 ASP.NET Core 应用程序,尤其是托管在云中或服务器场中时. 什么是分布式的缓存 分布式的缓存由多个应用程序服务器共享,缓存中的信息不存储在单独的 Web ...

  8. 关于.net core 中的signalR组件的使用

    SignalR是为了提供更方便的web交互响应式到推送式的解决方案.有了它之后可以实现客户端直接调用服务端的方法并且获得返回值 (客户端可以是各种平台,目前SignalR支持的语言版本有C#.java ...

  9. 二、在 ASP.NET Core 中使用 SignalR之类库

    一.前段代码: @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="view ...

随机推荐

  1. 使用React实现一个TodoList案例

    1.效果图: 2.项目源码 3.源码 TodoList.js import React, { Component, Fragment } from 'react'; import TodoItem f ...

  2. Python中使用模块和库编程

    """ python中使用模块和库编程 导入模块 import modulename [as alias] from modulename import fun1,fun ...

  3. Vue整合axios 插件方式

    1 创建一个vue的项目 使用命令 vue create axios-vue 创建,可以什么都不用勾选 2 安装axios npm install axios --save 如果安装过程很慢的话,也可 ...

  4. Git上传本地仓库文件到Gitee(Github同理)

    前言:本来想把最近的代码更新到Github上,但是校园网打不开,于是决定暂时先更新到Gitee中,Github中的操作也同理. 1. 创建云仓库: 就是在Gitee/Github上创建仓库,这里不演示 ...

  5. 背包问题dp的初步总结

    背包问题 01背包 给定的物体只有0个和1个,只有选与不选的划分,其状态转移方程时由i-1行推出,所以第二层循环是由j=m,递减到v[i]的. for(int i=1;i<=n;i++){ fo ...

  6. Ubuntu 下 Mariadb 数据库的安装和目录迁移

    Ubuntu 下 Mariadb 数据库的安装和目录迁移 1.简介 本文主要是 Ubuntu 下 Mariadb 数据库的安装和目录迁移,同样适用于 Debian 系统:Ubuntu 20.0.4 M ...

  7. Python实现双X轴双Y轴绘图

    诈尸人口回归.这一年忙着灌水忙到头都掉了,最近在女朋友的提醒下终于想起来博客的账号密码,正好今天灌水的时候需要画一个双X轴双Y轴的图,研究了两小时终于用Py实现了.找资料的过程中没有发现有系统的文章, ...

  8. VulnHub-Earth 打靶记录

    目录 VulnHub-Earth 打靶记录 知识点 目标探测 信息收集 Shell反弹&信息二次收集 提权 权限维持 VulnHub-Earth 打靶记录 搭建靶场的时候一定要使用NATser ...

  9. Jwt验证登录

    练习模板:https://gitee.com/zh1446802857/swagger-multi-version-api.git Jwt在我的 认知里,是一套门锁.别人(用户)需要用到你的接口 的时 ...

  10. IDEA编译项目后,target目录下的jsp文件不更新

    tomcat目录说明 先来看一下tomcat的目录: |-bin |-conf |-lib |-logs |-temp |-webapps |-work tomcat 的核心是servlet容器,叫 ...