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+ 中统一渲染模式(Auto/Interactive)的配置
.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 压缩、懒加载程序集(<publishtrimmed>true</publishtrimmed>)、预加载关键资源 认证与状态:Server 可直接使用 Cookie 认证;WASM 需通过 API Token(如 JWT)并自行管理本地 token 存储与刷新逻辑
基本上就这些。选对初始模板最省事,混合渲染是渐进升级的好工具,但别指望一键切换底层模型——Server 和 WASM 是两套不同的执行契约。
