Blazor WASM中blazor-error-ui触发逻辑及异步异常捕获问题

问题概述 #

• ASP.NET Core框架在Blazor WASM应用中，如何将初始隐藏的错误提示div切换为显示状态，初始DOM结构如下：

<div id="blazor-error-ui" style="display: none;">

• 检索aspnetcore官方仓库源码未找到对应实现逻辑，是否存在代码查找位置错误？
• 参照官方文档实现的自定义日志记录器可正常捕获普通同步异常，但无法捕获异步方法抛出的异常；使用ErrorBoundary组件也存在相同问题。
• 异步方法抛出异常时，异常仅输出到浏览器控制台，不会传递到自定义日志记录器，但blazor-error-ui会正常切换为显示状态：

<div id="blazor-error-ui" style="display: block;">

• 框架本身可感知这类异步异常，为何自定义日志组件无法捕获记录这类异常？

具体解答 #

1. blazor-error-ui的显示逻辑位置 #

你查找的代码范围有误，这段控制逻辑不在C#托管代码层，而是实现在Blazor WASM初始加载的blazor.webassembly.js脚本中：

• 脚本初始化阶段会提前绑定.NET WASM运行时的全局未处理异常监听，异常触发时直接通过原生DOM操作修改#blazor-error-ui元素的display属性为block，异常状态重置时再改回none。
• 这段逻辑属于JS互操作层的前置初始化代码，和WASM运行时启动流程绑定，不会出现在C#源码目录下，仅检索C#源码无法找到对应实现。

2. 异步异常无法被自定义日志/ErrorBoundary捕获的原因 #

Blazor WASM的组件渲染异常链路和全局异步异常链路是相互分离的：

• ErrorBoundary组件仅能捕获组件渲染生命周期内、同步触发、以及被组件级同步上下文接管的异常。如果异步方法脱离组件生命周期上下文抛出异常（包括未被await的Task、async void方法、非组件托管的定时器回调抛出的异常），这类异常不会进入组件渲染异常链路，自然无法被ErrorBoundary捕获。
• 自定义日志记录器默认仅监听DI容器中ILogger管道上报的异常，这类脱离上下文的全局异步异常会直接抛到WASM运行时顶层未处理异常处理器，不会走ILogger上报管道，仅会被运行时默认逻辑输出到浏览器控制台，同时触发JS层的错误UI显示逻辑。

3. 全局异步异常的捕获方案 #

要捕获所有未处理异常（包括脱离组件上下文的异步异常），需要在WASM启动阶段注册全局未处理异常回调，示例代码如下：

// Program.cs
var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");
builder.RootComponents.Add<HeadOutlet>("head::after");

var host = builder.Build();
// 注册全局未处理异常回调
host.UnhandledException += (sender, eventArgs) =>
{
    // 调用自定义日志组件写入异常
    var logger = host.Services.GetRequiredService<ILogger<Program>>();
    logger.LogError(eventArgs.Exception, "捕获到全局未处理异常");
    
    // 如果不需要弹出默认错误提示UI，可取消下行注释
    // eventArgs.Handled = true;
};

await host.RunAsync();

.NET 6及以上版本中，所有未被捕获的同步、异步异常（包括未await的Task、async void抛出的异常）都会进入该全局回调，无需额外监听AppDomain级别的异常事件。

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