实时应用

文档地址 (基于 8.0)

新的框架, 不依赖于 jQuery

ASP.NET Core SignalR 概述

什么是 SignalR

SignalR 是一个开源的代码库. 用于简化实时 Web 应用.

适合 SIgnalR 的应用:

  • 需要高频更新的数据的应用, 如数字大屏, 股票, 地图等 (实时数据).
  • 仪表板应用, 监视应用 (实时数据).
  • 协作引用 (涉及数据同步, 广播等).
  • 需要通知的应用 (被动消息).

Signal 提供了 远程过程调用 (RPC) 的 API.

简单说就是, 服务器上有一个方法, 前端浏览器直接使用这个方法名进行调用, 但是方法在服务器上执行.

SignalR 的一些功能:

GitHub 托管 SignalR 代码.

传输

SignalR 支持的通信技术 (按照正常的回退顺序):

  • WebSocket
  • Server-Sent Events
  • 长轮询

SignalR 会自动选择.

中心 (Hub)

从文档看 Hub 方式是推荐的方式, 可以在浏览器, 与服务器之间互相调用方法 (RPC 模型).

在确定类型之后, 可以支持模型绑定.

SignalR 支持两种中心协议:

  • 基于 JSON 的文本协议 (以前好像主要以这个方式为主 (ws 时代)).
  • 基于 MessagePack 的二进制协议. 它的消息更小. 老浏览器不支持 (XHR2+).

调用模型与 Invoke 方法类似, 将方法名 + 参数, 一并作为参数传入, 进行调用.

SignalR 面向 ES6, 低版本浏览器需要使用 babel.

ASP.NET Core SignalR 支持的平台

看文档的意思, SignalR 与 ASP.NET Core 配合使用最好.

基本上可以认为现代平台都支持 SignalR.

(raw)教程 - 使用 JavaScript 的 SignalR

可以认为是使用案例

基本思路就是创建一个 RazorPages 项目, 然后在后端代码与页面模板中分别编写代码. 属于后端渲染的项目.

基本步骤:

  1. 使用 ASP.NET Core 的 webapp 模板来创建 RazorPages 项目.
  2. 安装工具 Microsoft.Web.LibraryManager.Cli (逻辑上相当于 node 工具中的 npm).
  3. 定位到 csproj 文件所在的文件, 安装 @microsoft/signalr, 到 wwwroot/js/signalr 目录中.
  4. 创建 Signal Hub 类. 从 Hub 派生, 实现 SendMessage 方法.
  5. 配置 SignalR. 添加 SignalR 服务 (AddSignalR()), 映射到指定路径.
  6. 添加 SignalR 客户端代码. 就是在 RazorPages 页面文件中添加 HTML, 引入两个 js 文件 (一个库, 一个自定义的脚本).
  7. 编写 js 脚本. 创建连接, 注册事件, 启动连接, 触发调用 SendMessage.

细节待整理

(raw)教程 - 使用 TypeScript 的 SignalR

可以认为是使用案例

基本逻辑是创建前后分离的项目, 前端部分由 webpack 打包, 生成到 wwwroot 目录中, 然后后端提供接口.

细节步骤待二刷整理.

jk: 结论是 TS 写前端项目, 还是需要依赖于类似于 webpack 的打包工具 (也可以是 vite 等).

jk: Mastering TypeScript 待二刷.

(raw)教程 - 使用 Blazor 的 SIgnalR

可以认为是使用案例

前提是需要熟悉 Blazor 项目, 包括创建, 项目结构, 代码结构, 如果编码, 编译部署等. 待整理.

示例

官方托管到 GitHub 中的示例代码.

服务器概念

中心 (Hub)

SignalR Hub API 的形式是, 在客户端 "调用" "定义" 在服务端的方法, 也可以在服务端 "调用" "定义" 在客户端的方法.

SignalR 还支持在客户端之间互相调用 (客户端 A, 调用客户端 B 的方法).

SignalR 屏蔽了调用之间的差异.

配置 Signal Hub

两个步骤: 1. 添加 SignalR 服务; 2. 配置 SIgnalR 端点.

builder.Services.AddSignalR();
...
app.MapHub<Hub类>("/端点路径");

SignalR 程序集与 .NET Core SDK 一起安装.

创建和使用 Hub

从 Hub 类派生, 并实现 public 方法. 例如:

public class ChatHub: Hub {
  public async Task SendMessage(string user, string message) 
    => await Clients.All.SendAsync("收到消息", user, message);
}

备注:

  • 该类会在请求时被实例化, 所以其生命周期具有不确定性. 不要使用其属性存储数据.

  • 不要实例化该类, 该类的实例由 SignalR 维护.

  • 要使用 async 和 await (约定).

上下文对象 Context

Hub 对象具有一个上下文属性 Context, 该属性包含连接相关的信息 (标识符, 用户信息等).

属性与方法待二刷

客户端对象 Clients

Hub 对象的 Clients 属性, 该属性用于指定连接到服务端的客户端.

属性与方法待二刷

向客户端发消息

Last Updated:
Contributors: jk