如何在WPF应用程序中正确托管Blazor应用？

阿华AIGC实验室

2026-4-13

我之前刚好做过类似的需求——在WPF里嵌入Blazor Server作为网页配置界面，给你梳理一套靠谱的实现步骤和注意点：

一、先搞定依赖与项目结构

首先在你的WPF项目里安装必要的NuGet包：Microsoft.AspNetCore.Components.Server和Microsoft.AspNetCore.App（如果没自动引入的话）。

你可以选择两种组织方式：

直接在WPF项目里添加Blazor相关文件（比如Pages文件夹、Shared组件、App.razor、_Imports.razor），适合简单场景；
单独创建一个Blazor Server类库项目，再在WPF里引用，这样代码分离更清晰，维护起来更方便。

二、核心托管代码实现

在WPF的合适位置（比如主窗口的加载事件、后台服务）编写托管逻辑，重点是别阻塞WPF主线程，完整代码示例如下：

// 定义全局变量保存Blazor应用实例
private WebApplication? _blazorApp;

// 在WPF窗口加载事件中异步启动Blazor
private async void MainWindow_Loaded(object sender, RoutedEventArgs e)
{
    var builder = WebApplication.CreateBuilder(new WebApplicationOptions
    {
        Args = Array.Empty<string>(),
        // 指定监听地址，避免端口冲突，也可以让用户自定义
        Urls = "http://localhost:5000;https://localhost:5001"
    });

    // 注册Blazor Server核心服务
    builder.Services.AddRazorComponents()
        .AddInteractiveServerComponents();

    // 可选：注册共享服务，实现WPF与Blazor的数据交互
    builder.Services.AddSingleton<AppConfigService>();

    _blazorApp = builder.Build();

    // 配置HTTP管道，这部分不能少
    if (!_blazorApp.Environment.IsDevelopment())
    {
        _blazorApp.UseExceptionHandler("/Error");
        _blazorApp.UseHsts();
    }

    _blazorApp.UseHttpsRedirection();
    _blazorApp.UseStaticFiles(); // 必须添加，负责加载Blazor的CSS、JS等静态资源
    _blazorApp.UseRouting();

    // 映射Blazor根组件，替换成你自己的根组件类型
    _blazorApp.MapRazorComponents<App>()
        .AddInteractiveServerRenderMode();

    // 异步启动，避免卡死WPF界面
    await _blazorApp.RunAsync();
}

三、关键注意事项

主线程不阻塞：一定要用RunAsync()而不是同步的Run()，并且在异步方法里执行，否则WPF界面会直接卡住。
静态资源必须配置：UseStaticFiles()是刚需，没加的话Blazor界面会丢失样式和交互能力。
生命周期管理：WPF关闭时要主动停止Blazor应用，释放资源，不然可能会有进程残留：

private async void MainWindow_Closing(object sender, System.ComponentModel.CancelEventArgs e)
{
    if (_blazorApp != null)
    {
        await _blazorApp.StopAsync();
        _blazorApp.Dispose();
    }
}