Blazor Server页面切换时，如何停止后台循环读取任务？

要实现Blazor页面离开时停止循环读取远程机器值，可根据组件场景选择以下两种处理方式：

1. 组件销毁时停止（适用于普通路由页面） #

当用户切换页面时，当前Razor组件会被销毁，此时通过实现IDisposable接口触发停止逻辑：

@implements IDisposable

@code {
    private CancellationTokenSource _cts;

    protected override void OnInitialized()
    {      
        _cts = new CancellationTokenSource();
        // 启动异步循环读取，传入取消令牌
        _ = Read_cyclic_values(_cts.Token);
    }

    public async Task Read_cyclic_values(CancellationToken cancellationToken)
    {
        while (!cancellationToken.IsCancellationRequested)
        {
            // 编写你的循环读取逻辑（调用scoped service的相关方法）
            
            // 示例：添加读取间隔，避免高频请求
            await Task.Delay(1000, cancellationToken);
        }
    }

    public void Dispose()
    {
        // 取消循环并释放资源
        _cts?.Cancel();
        _cts?.Dispose();
    }
}

核心逻辑： #

• 用CancellationTokenSource生成取消令牌，控制循环终止
• Blazor会在组件销毁时自动调用Dispose方法，借此取消循环
• 将读取方法改为异步并传入令牌，确保循环能及时响应取消指令

2. 导航切换时停止（适用于组件不被销毁的场景） #

若组件位于布局中或切换页面时不会被销毁，可监听NavigationManager的导航变化事件来停止循环：

@inject NavigationManager NavigationManager
@implements IDisposable

@code {
    private CancellationTokenSource _cts;
    private IDisposable _navigationSubscription;

    protected override void OnInitialized()
    {      
        _cts = new CancellationTokenSource();
        _ = Read_cyclic_values(_cts.Token);

        // 订阅导航变化事件
        _navigationSubscription = NavigationManager.LocationChanged += OnLocationChanged;
    }

    private void OnLocationChanged(object sender, LocationChangedEventArgs e)
    {
        // 用户切换页面时取消循环
        _cts?.Cancel();
    }

    public async Task Read_cyclic_values(CancellationToken cancellationToken)
    {
        while (!cancellationToken.IsCancellationRequested)
        {
            // 循环读取逻辑
            await Task.Delay(1000, cancellationToken);
        }
    }

    public void Dispose()
    {
        // 取消订阅并释放资源
        _navigationSubscription?.Dispose();
        _cts?.Cancel();
        _cts?.Dispose();
    }
}

核心逻辑： #

• 注入NavigationManager监听页面导航变化
• 导航事件触发时立即取消循环读取
• 在Dispose中清理订阅和令牌资源，避免内存泄漏

内容的提问来源于stack exchange，提问作者Mdarende