如何在Blazor Web Assembly项目中集成使用Serilog

Blazor Web Assembly运行在浏览器端沙箱环境，和Blazor Server的集成逻辑有差异，核心是使用适配浏览器运行时的Serilog Sink，具体实现步骤如下：

1. 安装依赖NuGet包 #

在WASM项目中安装以下包：

• Serilog：Serilog核心库
• Serilog.Extensions.Logging：用于对接.NET 原生日志框架
• Serilog.Sinks.BrowserConsole：将日志输出到浏览器开发者工具控制台，是WASM场景最基础的输出目标
• 可选：Serilog.Sinks.Http：如果需要将日志批量上报到后端日志接口，安装该包实现HTTP日志推送

2. 修改Program.cs初始化Serilog #

替换WASM项目Program.cs中原有的日志配置，代码如下：

using Serilog;
using Serilog.Events;

// 初始化Serilog实例
Log.Logger = new LoggerConfiguration()
    .MinimumLevel.Debug()
    // 过滤微软组件产生的冗余Debug日志
    .MinimumLevel.Override("Microsoft", LogEventLevel.Information)
    .Enrich.FromLogContext()
    // 输出日志到浏览器控制台
    .WriteTo.BrowserConsole()
    // 如需上报日志到后端，取消注释并替换为自己的日志接收接口地址
    // .WriteTo.Http(
    //     requestUri: "https://your-api-domain.com/api/log/receive",
    //     queueLimitBytes: null
    // )
    .CreateLogger();

var builder = WebAssemblyHostBuilder.CreateDefault(args);

// 清除默认日志提供器，替换为Serilog
builder.Logging.ClearProviders();
builder.Logging.AddSerilog(Log.Logger);

// 保留原有项目配置，不需要修改
builder.RootComponents.Add<App>("#app");
builder.RootComponents.Add<HeadOutlet>("head::after");
// 你自己的其他服务注册逻辑，比如AddHttpClient、AddScoped等保持不变

var app = builder.Build();

try
{
    Log.Information("Blazor WASM 应用启动完成");
    await app.RunAsync();
}
catch (Exception ex)
{
    Log.Fatal(ex, "应用启动异常终止");
}
finally
{
    // 应用退出时flush所有未写入的日志
    Log.CloseAndFlush();
}

3. 日志使用方式 #

集成完成后不需要修改业务代码的日志写法，和.NET原生日志用法完全一致：

• 优先通过构造函数注入ILogger<T>实例，调用LogDebug()、LogInformation()、LogWarning()、LogError()等方法写日志
• 特殊场景下也可以直接全局调用Log.xxx()静态方法写日志，但不推荐在业务代码中大量使用静态调用

注意事项 #

• Blazor WASM无法访问服务器本地文件系统、系统事件日志等操作系统级资源，所有依赖本地IO的Serilog Sink（比如文件写入Sink、非浏览器版的控制台Sink）都无法在WASM中正常使用
• 生产环境建议将全局最低日志级别调整为Information或Warning，避免大量Debug日志占用带宽、泄露敏感信息
• 如果需要持久化存储日志，不要尝试在WASM端直接写本地文件，可以通过Http Sink上报到后端统一存储，也可以通过JS互操作调用浏览器IndexedDB/localStorage做本地暂存
• 如需捕获全局未处理异常，可以自定义错误边界组件，在异常捕获逻辑中调用Serilog写入错误日志即可

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