Blazor 交互模式 (Server/WASM) 设置方法_网络技术_宿州市腾雀网络科技有限公司

Blazor提供Server和WebAssembly两种交互模式，创建项目时需通过模板选定；Server依赖SignalR服务端执行，WASM在浏览器中运行.NET运行时；迁移需手动重构项目结构与配置，.NET 8+支持混合渲染模式按组件指定交互方式。

Blazor 提供两种主流交互模式：Server（服务端渲染）和 WebAssembly（客户端运行），选择和配置方式取决于部署环境与应用需求。关键不是“切换模式”，而是创建项目时选定模板，后续可通过修改配置迁移，但需注意运行机制差异带来的限制。

使用 .NET CLI 或 Visual Studio 创建 Blazor 项目时，模板决定了初始模式：

Blazor Server：执行 dotnet new blazorserver -n MyApp，默认启用 SignalR 实时连接，页面逻辑在服务器执行，浏览器只负责 UI 渲染和事件转发
Blazor WebAssembly：执行 dotnet new blazorwasm -n MyApp，生成独立的前端应用，.NET 运行时通过 WebAssembly 在浏览器中运行，可托管在任意静态文件服务器上
带 ASP.NET Core Hosted 的 WASM（即“托管式 WASM”）：加 --hosted 参数，如 dotnet new blazorwasm --hosted -n MySolution，会生成包含 API 后端的完整解决方案，适合需要后端 API 支持的离线优先场景

Blazor Server 和 WASM 项目结构、依赖项、启动逻辑不同，无法通过改一个配置项切换。迁移需手动操作：

将 Server 项目改为 WASM：需新建 WASM 项目，把 Shared/ 和 Pages/ 等业务代码迁移过去；替换 Program.cs 中的 AddServerSideBlazor() 为 AddWasmRenderMode()（.NET 8+）或 AddBlazorWebAssemblyHostedService()；移除 SignalR 相关引用和 _Host.cshtml
将 WASM 改为 Server：需新建 Server 项目，迁移组件；修改 Program.cs 使用 AddServerSideBlazor()；将 index.html 替换为 _Host.cshtml；删除 wwwroot/_framework/ 相关发布逻辑
注意：HTTP 客户端调用（如 HttpClient）、状态管理、认证方式（如 JWT vs Cookie）、静态资源路径等均需同步调整

.NET 8 引入了“混合渲染”能力，允许同一应用中按需指定组件渲染方式（Server、WASM 或 Auto）。关键在 _Imports.razor 和组件标记中设置：

在 Program.cs 中注册交互式渲染器：
builder.Services.AddRendering();
并为不同模式添加服务（如 AddInteractiveServerComponents() 和 AddInteractiveWebAssemblyComponents()）
在组件顶部添加渲染指令：
@rendermode InteractiveServer 或 @rendermode InteractiveWebAssembly
或使用自动降级：@rendermode InteractiveAuto（先尝试 WASM，失败则回退 Server）
确保 _Host.cshtml（Server）或 index.html（WASM）正确加载对应 JS 初始化脚本（如 blazor.server.js 或 blazor.webassembly.js）

模式决定部署方式和运行约束：

Server 模式：必须部署在支持 WebSocket/Long Polling 的服务器（如 IIS、Kestrel、Nginx 配合 proxy_pass），需维持用户会话连接，不适用于高延迟或弱网环境
WASM 模式：部署为纯静态文件（HTML/JS/WASM），但首次加载体积较大（约 2–5 MB），建议启用 Brotli 压缩、懒加载程序集（true）、预加载关键资源
认证与状态：Server 可直接使用 Cookie 认证；WASM 需通过 API Token（如 JWT）并自行管理本地 token 存储与刷新逻辑

基本上就这些。选对初始模板最省事，混合渲染是渐进升级的好工具，但别指望一键切换底层模型——Server 和 WASM 是两套不同的执行契约。