SignalR 入门 .netCore实现聊天室

本文根据微软SignalR 简介 | Microsoft DocsASP.NET Core SignalR 简介 | Microsoft Docs 内容,结合自己学习过程中的理解而成,希望对大家认识和使用SinalR有帮助。

什么是SignalR?

ASP.NET SignalR 是 ASP.NET 开发人员的库

可以用来干什么?

可简化将实时 web 功能添加到应用程序的过程。 实时 web 功能使服务器代码能够在可用时立即将内容推送到连接的客户端,而不是让服务器等待客户端请求新的数据。

SignalR 自动处理连接管理,让你可同时向所有连接的客户端广播消息,就像聊天室一样。 也可以向特定客户端发送消息。 客户端和服务器之间的连接是持久的,不同于传统的 HTTP 连接,后者针对每次通信重新建立。

SignalR 支持 "服务器推送" 功能,在该功能中,服务器代码可以使用远程过程调用来调用浏览器中的客户端代码 (RPC) [1],而不是目前在 web 上通用的请求-响应模式。

传统的获取服务器数据的方法是:通过客户端向服务器发送请求,服务器相应请求返回数据给客户端的方式(请求-响应模式)。而SinalR实现服务器主动向客户端推送数据。

SignalR怎么实现服务器和客户端之间的通信?

SignalR 使用 集线器Hub 在客户端和服务器之间进行通信。

中心是一种高级管道,它允许客户端和服务器分别调用方法。 SignalR 自动处理跨计算机边界的调度,使客户端能够在服务器上调用方法,反之亦然。 可以将强类型参数传递给方法,从而启用模型绑定。 SignalR 提供了两个内置的集线器协议:基于 JSON 的文本协议和基于 MessagePack的二进制协议。 与 JSON 相比,MessagePack 通常会创建较小的消息。 较早的浏览器必须支持 XHR 级别 2 ,才能提供 MessagePack 协议支持。

中心通过发送包含客户端方法的名称和参数的消息来调用客户端代码。 作为方法参数发送的对象将使用配置的协议进行反序列化。 客户端尝试将名称与客户端代码中的方法匹配。 当客户端找到匹配项时,它将调用方法并向其传递反序列化的参数数据。

代码实现:ASP.NET Core SignalR 入门 | Microsoft Docs

实现一个聊天室的场景demo,测试:打开两个浏览器聊天,显示聊天列表

添加 SignalR 客户端库。
  • 在“解决方案资源管理器”中,右键单击项目,然后选择“添加”>“客户端库” 。
  • 在“添加客户端库”对话框中,对于“提供程序”,选择“unpkg”。
  • 对于“库”,输入 @microsoft/signalr@latest
  • 选择“选择特定文件”,展开“dist/browser”文件夹,然后选择“signalr.js”和“signalr.min.js”。
  • 将“目标位置”设置为 wwwroot/js/signalr/,然后选择“安装”。
创建 SignalR 中心。

中心 是一个类,用作处理客户端 - 服务器通信的高级管道。

  • 在 SignalRChat 项目文件夹中,创建 Hubs 文件夹。

  • 在 Hubs 文件夹中,使用以下代码创建 chatHub.cs 文件 :

    using Microsoft.AspNetCore.SignalR;
    using System.Threading.Tasks; namespace SignalRChat.Hubs
    {
    public class ChatHub : Hub
    {
    public async Task SendMessage(string user, string message)
    {
    await Clients.All.SendAsync("ReceiveMessage", user, message);
    }
    }
    }
配置.netCore项目以使用 SignalR服务。
using SignalRChat.Hubs;

 public void ConfigureServices(IServiceCollection services)
{
...
services.AddSignalR();
} public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
...
app.UseEndpoints(endpoints =>
{
...
endpoints.MapHub<ChatHub>("/chatHub");
});
}

这些更改将 SignalR 添加到 ASP.NET Core 依赖关系注入和路由系统。

添加可将消息从任何客户端发送到所有连接客户端的代码。

html

<div class="container">
<div class="row">&nbsp;</div>
<div class="row">
<div class="col-2">User</div>
<div class="col-4"><input type="text" id="userInput" /></div>
</div>
<div class="row">
<div class="col-2">Message</div>
<div class="col-4"><input type="text" id="messageInput" /></div>
</div>
<div class="row">&nbsp;</div>
<div class="row">
<div class="col-6">
<input type="button" id="sendButton" value="Send Message" />
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<hr />
</div>
</div>
<div class="row">
<div class="col-6">
<ul id="messagesList"></ul>
</div>
</div>
<script src="~/js/signalr/dist/browser/signalr.js"></script>
<script src="~/js/chat.js"></script>

javascript

"use strict";

var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();

//Disable send button until connection is established
document.getElementById("sendButton").disabled = true; connection.on("ReceiveMessage", function (user, message) {
var li = document.createElement("li");
document.getElementById("messagesList").appendChild(li);
// We can assign user-supplied strings to an element's textContent because it
// is not interpreted as markup. If you're assigning in any other way, you
// should be aware of possible script injection concerns.
li.textContent = `${user} says ${message}`;
}); connection.start().then(function () {
document.getElementById("sendButton").disabled = false;
}).catch(function (err) {
return console.error(err.toString());
}); document.getElementById("sendButton").addEventListener("click", function (event) {
var user = document.getElementById("userInput").value;
var message = document.getElementById("messageInput").value;
connection.invoke("SendMessage", user, message).catch(function (err) {
return console.error(err.toString());
});
event.preventDefault();
});

前面的代码:

  • 创建并启动连接。
  • 向“提交”按钮添加一个用于向中心发送消息的处理程序。
  • 向连接对象添加一个用于从中心接收消息并将其添加到列表的处理程序。

  1. RPC(Remote Procedure Call)译作:远程过程调用,是一种通过网络从远程计算机程序上请求服务而不需要了解底层网络技术的思想。 RPC 是一种技术思想而非一种规范或协议,常见的技术和框架有:应用级的服务框架:阿里的 Dubbo/Dubbox、Google gRPC、Spring Boot/Spring Cloud。远程通信协议:RMI、Socket、SOAP(HTTP XML)、REST(HTTP JSON)。通信框架:MINA 和 Netty。花了一个星期,我终于把RPC框架整明白了! - 51CTO.COMRPC是什么,看完你就知道了 - 知乎 (zhihu.com)

SignalR 入门 .netCore实现聊天室的更多相关文章

  1. [SignalR]一个简单的聊天室

    原文:[SignalR]一个简单的聊天室 1.说明 开发环境:Microsoft Visual Studio 2010 以及需要安装NuGet. 2.添加SignalR所需要的类库以及脚本文件: 3. ...

  2. Asp.net MVC + Signalr 实现多人聊天室

    Asp.net SignalR 简介: 首先简单介绍一下Signalr ,我也是刚接触,觉得挺好玩的,然后写了一个多人聊天室. Asp.net SignalR 是为Asp.net 开发人员提供的一个库 ...

  3. 第二个 SignalR,可以私聊的聊天室

    一.简介 上一次,我们写了个简单的聊天室,接下来,我们来整一个可以私聊的聊天室. SignalR 官方 API 文档 需求简单分析: 1.私聊功能,那么要记录用户名或用户ID,用于发送消息. 2.怎么 ...

  4. Asp.NET MVC 使用 SignalR 实现推送功能二(Hubs 在线聊天室 获取保存用户信息)

    简单介绍 关于SignalR的简单实用 请参考 Asp.NET MVC 使用 SignalR 实现推送功能一(Hubs 在线聊天室) 在上一篇中,我们只是介绍了简单的消息推送,今天我们来修改一下,实现 ...

  5. 使用ASP.NET SignalR实现一个简单的聊天室

    前言 距离我写上一篇博客已经又过了一年半载了,时间过得很快,一眨眼,就把人变得沧桑了许多.青春是短暂的,知识是无限的.要用短暂的青春,去学无穷无尽的知识,及时当勉励,岁月不待人.今天写个随笔小结记录一 ...

  6. 用SignalR 2.0开发客服系统[系列2:实现聊天室]

    前言 交流群:195866844 上周发表了 用SignalR 2.0开发客服系统[系列1:实现群发通讯] 这篇文章,得到了很多帮助和鼓励,小弟在此真心的感谢大家的支持.. 这周继续系列2,实现聊天室 ...

  7. Asp.NET MVC 使用 SignalR 实现推送功能一(Hubs 在线聊天室)

    简介       ASP .NET SignalR 是一个ASP .NET 下的类库,可以在ASP .NET 的Web项目中实现实时通信.什么是实时通信的Web呢?就是让客户端(Web页面)和服务器端 ...

  8. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室 实战系列

    ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(零) 前言  http://www.cnblogs.com/panzi/p/5742089.html ASP.NET S ...

  9. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(十二) 代码重构使用反射工厂解耦(一)缓存切换

    前言 上一篇中,我们用了反射工厂来解除BLL和UI层耦合的问题.当然那是最简单的解决方法,再复杂一点的程序可能思路相同,但是在编程细节中需要考虑的就更多了,比如今天我在重构过程中遇到的问题.也是接下来 ...

随机推荐

  1. k8s之PV、PVC

    目录 一.PVC和PV 1.1 PV概念 1.2 PVC概念 1.3 PV与PVC之间的关系 1.4 两种PV的提供方式 二.基于nfs创建静态PV资源和PVC资源 2.1 配置nfs存储(192.1 ...

  2. Solution -「POJ 3710」Christmas Game

    \(\mathcal{Decription}\)   Link.   定义一棵圣诞树: 是仙人掌. 不存在两个同一环上的点,度数均 \(\ge 3\).   给出 \(n\) 棵互不相关的圣诞树,双人 ...

  3. 多图|一文详解Nacos参数!

    Nacos 中的参数有很多,如:命名空间.分组名.服务名.保护阈值.服务路由类型.临时实例等,那这些参数都是什么意思?又该如何设置?接下来我们一起来盘它. 1.命名空间 在 Nacos 中通过命名空间 ...

  4. Spring 高级特性之二:Processor——Bean生命周期关键触发时机

    任何对象都有生命周期,那么Spring Bean对象创建.管理.销毁的整个生命周期个关键触发时机如何体现呢?先说结论,后续案例验证结论. 根据上图可知,实际bean对象涉及生命周期的主要是一个构造器和 ...

  5. 使用SpringBoot整合MybatisPlus出现 : java.lang.IllegalStateException: Unable to find a @SpringBootConfiguration, you need to use @ContextConfiguration or @SpringBootTest(classes=...) with your test

    解决方案一: 将测试类的包路径改为和主启动类的一致 解决方法二: 不想改测试类的路径 就在测试类上添加要测试的类的classes

  6. mysql之导入导出

    1.使用工具,类似Sqlyog,Navciate等导入导出数据 2.使用mysqldump导入导出 2.1 导出 2.1.1 导出表数据和表结构 mysqldump -u用户名 -p密码 数据库名 & ...

  7. HTML表格总结

    知识小记: 表格的主要目的:用于HTML展示数据,不适用于布局. 表格由行的单元格组成,没有列,常识上的"列"的个数取决于行中单元格的个数. 表格本来就很丑,颜色线条美化交给css ...

  8. kali主机探测命令与工具集

    实验目的 熟悉ping.arping.fping.hping3.nbtscan.nping.p0f.xprobe2工具对目标主机的探测方法. 实验原理 目标识别工具发送特殊构造的数据包,根据返回的应答 ...

  9. 【C#基础概念】程序集Assembliy

    一.      程序集定义 二.      程序集结构 通常,静态程序集可能由以下四个元素组成: 程序集清单(manifest) 类型元数据metadata和程序集元数据. 实现这些类型的 Micro ...

  10. RadioButtton

    activity_radio_button.xml <?xml version="1.0" encoding="utf-8"?> <Relat ...