Blazor Server应用程序:如何设计,以便客户端请求接收相同的数据

灰犀牛

假设我们在默认的Blazor Server中有这个简单的经典计时器。

<p>Current count: @currentCount</p>

<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>

@code {
    private int currentCount = 0;

    private void IncrementCount()
    {
        currentCount++;
        Console.WriteLine($"Count incremented: {currentCount}");
    }

    private Timer timer;

    protected override void OnAfterRender(bool firstRender)
    {
        if (firstRender)
        {
            timer = new Timer();
            timer.Interval = 1000;
            timer.Elapsed += OnTimerInterval;
            timer.AutoReset = true;
            // Start the timer
            timer.Enabled = true;
        }
        base.OnAfterRender(firstRender);
    }

    private void OnTimerInterval(object sender, ElapsedEventArgs e)
    {
        IncrementCount();
        InvokeAsync(() => StateHasChanged());
    }

    public void Dispose()
    {
        // During prerender, this component is rendered without calling OnAfterRender and then immediately disposed
        // this mean timer will be null so we have to check for null or use the Null-conditional operator ?
        timer?.Dispose();
    }
}

现在,当我在浏览器中打开此页面时,每个新窗口的时间都从零开始(按预期)。但是,我想在浏览器中打开多个页面,并且每个页面都应该看到相同的时间(如果在我的第一个窗口中显示的时间是10,而我打开一个新窗口,则我希望两个窗口的时间都相同)。我该如何实现?

总的来说,我想创建一个简单的SPA,向用户显示实时股票价格值。任何建议,将不胜感激。

devNull

SignalR可能是此问题的首选Microsoft解决方案,因为它为应用程序提供了实时Web功能

在较高的级别上,您需要:

  1. Hub在服务器上创建一个负责处理与客户端的连接并广播消息(在您的情况下为股票信息)的服务器。
  2. 假设您已经具有某种轮询/接收库存更新的服务,则该服务可以使用IHubContext通过来向客户端发布更新Hub
  3. 客户端需要aHubConnection来接收来自服务器的消息。

这是使用类似方法的聊天应用程序的完整示例:https : //docs.microsoft.com/zh-cn/azure/azure-signalr/signalr-tutorial-build-blazor-server-chat-app

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Blazor客户端应用程序级别异常处理

如何在客户端更新 Blazor Server 应用程序的服务器端更改?

如何使用Azure函数后端保护静态客户端blazor应用程序?

如何在Blazor客户端应用程序中使用Bootstrap模态?

如何在Blazor客户端应用程序的服务中调用HttpClient

是否可能:使用 Blazor 服务器端作为客户端应用程序

.Net MAUI Blazor 应用程序 | 服务器端还是客户端?

当项目具有nlog依赖项时,Blazor客户端应用程序无法构建

从Blazor客户端应用程序从ASP.NET Core API下载文件

Java单击事件在Blazor客户端应用程序中不起作用

blazor 服务器应用程序中的 Identityserver 和客户端机密

如何启用客户端Blazor调试?

使用Blazor Server时如何添加客户端DOM javascript事件处理程序?

将客户端Blazor添加到现有的ASP.NET MVC5应用程序

SignalR .NET客户端连接到Blazor .NET Core 3应用程序中的Azure SignalR服务

VS Blazor 服务器应用程序模板:服务器到客户端 SignalR 通信

加载Blazor客户端应用程序时如何避免浏览器中的System.TypeLoadException未处理的异常

Blazor Server应用程序中JsInterop javascript端如何实现以及在何处实现?

无法调试客户端blazor

无法调试blazor客户端

Blazor客户端和WCF

检测客户端关闭连接Blazor

Blazor WebAssembly客户端数据注释本地化

如何使用Blazor生成并保存文件客户端?

在 Blazor 客户端中,如何为界面创建组件?

如何使用blazor创建Cookie客户端

如何在Blazor客户端中使用Socket?

blazor 在docker中运行,如何获取客户端IP?

Blazor Web应用程序的TCP接收器服务