SignalR 更新图表未按预期工作

Question

我正在使用 Net Core api 和 angular，我这里有一个仪表板有一些图表。我用两个不同的用户打开这个页面。当我在数据库中更改某些内容时，来自 signalr api 的更改数据和未更改数据都会像下面 console.log 中那样出现。在 db 中，我仅将最后一个第二个元素的 3 更改为 2。

  home.component.ts:2153 -1,1,31.01.2020,-1,2,-1
2 home.component.ts:2153 -1,1,31.01.2020,-1,3,-1
2 home.component.ts:2153 -1,1,31.01.2020,-1,2,-1
  home.component.ts:2153 -1,1,31.01.2020,-1,3,-1
  home.component.ts:2153 -1,1,31.01.2020,-1,2,-1
2 home.component.ts:2153 -1,1,31.01.2020,-1,3,-1
  home.component.ts:2153 -1,1,31.01.2020,-1,2,-1

在控制器的核心部分，我称之为。它调用一种方法，它 returns data

[HttpGet]
[Route("Charts")]
public IActionResult Charts(int refShare, int sicil)
{
    var timerManager = new TimerManeger(() => _hub.Clients.All.SendAsync(refShare.ToString(), new { type = "chart", data= _repo.SharingDashboard(refShare, sicil) }));
    return Ok(new { Message = "Charts Completed" });
}

在angular部分

this._hub= new signalR.HubConnectionBuilder().withUrl(Url.url.signalR.getMessages, {
      skipNegotiation: true,
      transport: signalR.HttpTransportType.WebSockets
}).build();
this._hub.start().
    then(()=>console.log("Connection Started")).
    catch(err=>console.log(err));
this._hub.on(this.refShare.toString(),(data)=>{
    this.RealTimeDahboard(data.data)
});
this.startHttpRequest();

当我在 RealTimeDahboard() 函数中写入 console.log 时，上面的结果就来了。所以我的图表总是在变化。当我同时打开两个用户时会发生这种情况。如果我打开一个用户，它可以正常工作。可能是什么原因？

感谢您的帮助

Answer 1

这可以证明是因为当您的第二个用户连接到集线器并调用您的方法时，它会实例化 new TimerManeger() 因此您有 2 个实例调用集线器方法 _hub.Clients.All.SendAsync().

例如，如果您有 10 个用户，您将在每个计时器滴答中收到 10 倍的数据。

你在这里用 signalr 做的事不对。当您的客户端连接到集线器时，它不应触发 http 方法。我建议只将您的客户添加到图表组，您的计时器服务会将更新的图表数据发送到连接到该组的所有客户。

我有一个 GitHub 项目，它也使用 SignalR 实时刷新图表数据，您可以看到我是如何解决您的类似问题的。你可以看看here.

我有一个类似的项目，在 GitHub 上有图表，你可以看到它是如何完成的。

SignalR 更新图表未按预期工作

SignalR Update Chart not working as expected

signalr

asp.net-core-webapi

angular