Blazor Server .NET 8：如何实现可中断的异步提交功能？

你的问题核心是同步循环霸占了UI线程，Blazor Server的UI交互和状态更新依赖单线程，你的while循环一直占着线程不放，导致Cancel按钮的点击事件根本没机会被处理。下面是具体修复方案：

核心修改方向 #

• 把async void替换成async Task：async void会绕过Blazor的同步上下文，容易引发状态更新异常，用async Task能正确管理异步流程。
• 循环中加入await Task.Delay()：这是解决阻塞的关键，它会主动让出UI线程，让Cancel按钮的点击事件有机会被执行。
• 用CancellationTokenSource替代布尔值_cancelled：更规范的取消机制，同时能直接实现"超时自动终止"的需求，比单纯布尔值更可靠。

修复后的完整代码 #

后端代码 #

private CancellationTokenSource? _cts;

async Task HandleValidSubmitAsync()
{
    // 初始化取消令牌源，同时设置超时时间
    _cts = new CancellationTokenSource(TimeSpan.FromSeconds(valFromAppSettings));
    
    try
    {
        // 循环等待取消信号或超时
        while (!_cts.Token.IsCancellationRequested)
        {
            // 每100毫秒让出一次线程，可根据实际需求调整间隔
            await Task.Delay(100, _cts.Token);
        }
    }
    catch (OperationCanceledException)
    {
        // 捕获取消异常，无需额外处理，仅标记流程终止
    }
    finally
    {
        // 清理资源，避免内存泄漏
        _cts.Dispose();
        _cts = null;
    }

    if (!_cts?.Token.IsCancellationRequested ?? false)
    {
        // 执行实际业务逻辑
    }
}

void Cancel()
{
    _cts?.Cancel();
    StateHasChanged();
}

前端代码（可选优化：添加按钮禁用状态） #

<RadzenButton Size="ButtonSize.Medium"
              ButtonStyle="ButtonStyle.Primary"
              ButtonType="ButtonType.Submit"
              Text="Send"
              Icon="send"
              Click="@HandleValidSubmitAsync"
              Disabled="@(_cts != null)" />

<RadzenButton Click="@Cancel" 
              Text="Cancel" 
              ButtonStyle="ButtonStyle.Light"
              Disabled="@(_cts == null)" />

改动说明 #

1. Task.Delay：强制UI线程释放控制权，让Cancel按钮的点击事件能被处理，否则循环会一直霸占线程，Cancel方法永远触发不了。
2. CancellationTokenSource：同时支持手动取消（Cancel按钮）和自动超时取消，完美匹配你的需求，避免了布尔值可能出现的线程安全问题。
3. async Task：Blazor能正确跟踪异步任务生命周期，确保组件状态更新正常，避免内存泄漏或状态异常。

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