编辑
2023-04-07
我当开发
00
请注意,本文编写于 1277 天前,最后修改于 892 天前,其中某些信息可能已经过时。

目录

1. SignalR注入
2. 环境搭建
3. 升级本地SignalRJS
4. 服务端
5. 客户端
6. 应用

.Net7 新增了 SignalR 可以获取客户端数据的方法,即原方法 InvokeAsync 支持返回值,这里结合官网做了测试,作为记录

1. SignalR注入

路

2. 环境搭建

继续略

3. 升级本地SignalRJS

结合这两个地址

ASP.NET Core SignalR JavaScript 客户端

microsoft-signalr

注意js版本号7.0+,下到本地也行,从vs2022添加客户端也行,如果本地低在调用js方法后会显示版本不支持;

4. 服务端

/// <summary> /// 得到客户端结果 /// </summary> /// <param name="evname"></param> /// <param name="msg"></param> /// <param name="id"></param> /// <returns></returns> public static async Task<dynamic> GetHubMessage(string evname, string msg, string id = "") { //尝试拿一个hubid if (string.IsNullOrEmpty(id)) { id = GetHubID(); } if (string.IsNullOrEmpty(id)) { return default; } var Hub = PageContext.GetServerByApp<IHubContext<SignalRHub>>(); var msr = await Hub.Clients.Client(id).InvokeAsync<dynamic>(evname, msg, new CancellationToken()); return msr ?? default; } /// <summary> /// 尝试得到本次的hubid /// </summary> /// <returns></returns> public static string GetHubID() { var hubid = string.Empty; var head = PageContext.Current!.Request.Headers; if (head.ContainsKey("hubid")) { hubid = head["hubid"]; } else if (PageContext.Current!.Request.Form.ContainsKey("hubid")) { hubid = PageContext.Current!.Request.Form["hubid"]; } return hubid; }

以上代码 核心方法就是 InvokeAsync ,其他都来自服务就可以了,注意接收值,前台的返回我测试了 数组 对象,后台的接到到的类型是 System.Text.Json , 而不是 Newtonsoft.Json,尽量返回字符串比较稳定;用的时候直接调用即可 GetHubMessage("getMessage","Grid1");

我这里触发的前端方法是 getMessage 如果前端没有注册 getMessage ,则会提示 Client didn't provide a result.(客户端没有返回结果)

5. 客户端

const connection = new signalR .HubConnectionBuilder() .withUrl("/HomeHub") .build(); window.hub.connection = connection; ... window.hub.connection.on(`getMessage`,async (msg)=>{ return JSON.stringify(F.ui[msg].fields); });

这里注意了,我的HomeHub连接是在顶层框架页面,即只有一个实例,如果同一个实例注册多个方法即getMessage并返回结果,会报错,Client provided multiple results(客户端提供了多个结果);

6. 应用

这样就拿到数据了,那在什么情况下会用到呢,场景要有几个特点,数据回发提交的时候有的参数没带着,或者带不了;或者这是客户端还没有数据,等会才有;或者需要等待客户继续操作后才能拿到结果;

一个典型的场景就是确认Confirm,之前我已经将F.confirm 改为异步了,用Promise包一下就行;之前也改造过等待客户响应的方法,使用客户端响应后二次提交从缓存拿到任务再改变状态,绕了一大圈,存在超时和中断问题;升级之后,后台执行到需要客户选择的代码,可以直接由服务端发起,然后等着前台返回就行了,省去了不少代码;

其他应用场景还有待探索。

如果对你有用的话,可以打赏哦
打赏
ali pay
wechat pay

本文作者:没想好

本文链接:

版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!