ASP.NET Core Blazor 托管模型
注意
此版本不是本文的最新版本。 对于当前版本,请参阅此文的 .NET 8 版本。
警告
此版本的 ASP.NET Core 不再受支持。 有关详细信息,请参阅 .NET 和 .NET Core 支持策略。 对于当前版本,请参阅此文的 .NET 8 版本。
本文介绍 Blazor 托管模型,主要侧重于早于 .NET 8 版本的 .NET 应用中的 Blazor Server 和 Blazor WebAssembly。 本文中的指南与本机移动和桌面平台上运行的 Blazor Hybrid 应用的所有 .NET 版本相关。 .NET 8 或更高版本中的 Blazor Web App 通过 Razor 组件呈现方式(描述为呈现模式)更好地概念化。 基础知识概述文章中简要介绍了呈现模式,BlazorASP.NET Core 呈现模式组件节点中对此进行了详细介绍。
本文介绍 Blazor 托管模型,以及如何选择要使用的模型。
Blazor 是一个 Web 框架,用于生成可通过不同方式托管的 Web UI 组件(Razor 组件)。 Razor 组件可以在 ASP.NET Core (Blazor Server) 中运行服务器端,并在浏览器中使用基于 WebAssembly 的 .NET 运行时(Blazor WebAssembly、Blazor WASM)运行客户端。 还可以在本机移动应用和桌面应用中托管 Razor 组件,将其呈现到嵌入式 Web View 控件 (Blazor Hybrid)。 无论采用哪种托管模式,生成 Razor 组件的方式都是相同的。 相同的 Razor 组件可以在任何托管模型下使用,没有任何变化。
Blazor 是一个 Web 框架,用于生成可通过不同方式托管的 Web UI 组件(Razor 组件)。 Razor 组件可以在 ASP.NET Core (Blazor Server) 中运行服务器端,并在浏览器中使用基于 WebAssembly 的 .NET 运行时(Blazor WebAssembly、Blazor WASM)运行客户端。 无论采用哪种托管模式,生成 Razor 组件的方式都是相同的。 相同的 Razor 组件可以在任何托管模型下使用,没有任何变化。
Blazor Server
使用 Blazor Server 托管模型可从 ASP.NET Core 应用中在服务器上执行组件。 UI 更新、事件处理和 JavaScript 调用是通过 SignalR 连接使用 WebSocket 协议进行处理。 服务器上与每个连接的客户端相关联的状态被称为线路。 线路不绑定到特定网络连接,可以承受短暂的网络中断,允许客户端在连接丢失时尝试重新连接到服务器。
在传统的服务器呈现应用中,在多个浏览器屏幕(选项卡或 iframes
)中打开同一应用通常不会对服务器产生额外的资源需求。 对于 Blazor Server 托管模型,每个浏览器屏幕都需要单独的线路和单独的服务器托管组件状态实例。 Blazor 将关闭浏览器标签页或访问外部 URL 视为正常终止。 如果正常终止,则会立即释放线路和关联的资源。 例如,由于网络中断,客户端也可能异常地断开连接。 Blazor Server 会将断开连接的路线存储一段时间(可配置),以便客户端重新连接。
在客户端上,Blazor 脚本与服务器建立 SignalR 连接。 脚本由 ASP.NET Core 共享框架中的嵌入资源提供。
Blazor Server 托管模型具有以下优点:
- 下载项大小明显小于使用 Blazor WebAssembly 托管模型时的大小,并且应用加载速度要快得多。
- 应用可以充分利用服务器功能,包括对 .NET Core API 的使用。
- 服务器上的 .NET Core 用于运行应用,因此调试等现有 .NET 工具可按预期正常工作。
- 支持瘦客户端。 例如,Blazor Server 适用于不支持 WebAssembly 的浏览器以及资源受限的设备。
- 应用的 .NET/C# 代码库(其中包括应用的组件代码)不适用于客户端。
Blazor Server 托管模型具有以下局限性:
- 通常延迟较高。 每次用户交互都涉及到网络跃点。
- 不支持脱机工作。 如果客户端连接失败,交互性将失效。
- 若要缩放具有许多用户的应用,需要使用服务器资源处理多个客户端连接和客户端状态。
- 需要 ASP.NET Core 服务器为应用提供服务。 无服务器部署方案不可行,例如通过内容分发网络 (CDN) 为应用提供服务的方案。
对于采用 Blazor Server 托管模型的应用,我们建议使用 Azure SignalR 服务。 该服务允许将 Blazor Server 应用扩展到大量并发 SignalR 连接。
Blazor WebAssembly
Blazor WebAssembly 托管模型在浏览器中使用基于 WebAssembly 的 .NET 运行时来运行组件客户端。 Razor 组件、其依赖项以及 .NET 运行时将下载到浏览器。 组件将在浏览器 UI 线程中直接执行。 UI 更新和事件处理在同一进程中进行。 资产作为静态文件部署到可为客户端提供静态内容的 Web 服务器或服务中。
Blazor Web 应用可以使用 Blazor WebAssembly 托管模型来启用客户端交互。 当创建的应用专门在 Blazor WebAssembly 托管模型上运行而无需服务器端呈现和交互性时,该应用称为独立 Blazor WebAssembly 应用。
如果创建了 Blazor WebAssembly 应用进行部署,但没有后端 ASP.NET Core 应用来为其文件提供服务,那么该应用被称为独立 Blazor WebAssembly 应用。
当独立 Blazor WebAssembly 应用使用后端 ASP.NET Core 应用提供其文件时,该应用称为托管 Blazor WebAssembly 应用。 使用托管的 Blazor WebAssembly,可以通过 .NET 获得完整堆栈 Web 开发体验,包括能够在客户端和服务器应用之间共享代码、支持预呈现以及与 MVC 和 Razor Pages 集成。 托管客户端应用可以使用各种消息传递框架和协议(例如 Web API、gRPC-Web 和 SignalR(结合使用 ASP.NET Core SignalR 和 Blazor))通过网络与其后端服务器应用进行交互。
构建为渐进式 Web 应用 (PWA) 的 Blazor WebAssembly 应用使用新式浏览器 API 启用本机客户端应用的许多功能,例如脱机工作、在其自己的应用窗口中运行、从主机的操作系统启动、接收推送通知以及在后台自动更新。
Blazor 脚本处理以下事项:
- 下载 .NET 运行时、Razor 组件和组件的依赖项。
- 运行时的初始化。
已发布应用的大小(其有效负载大小)是应用可用性的关键性能因素。 大型应用需要相对较长的时间才能下载到浏览器,这会损害用户体验。 Blazor WebAssembly 优化有效负载大小,以缩短下载时间:
- 在中间语言 (IL) 裁边器发布应用时,会从应用删除未使用的代码。
- 压缩 HTTP 响应。
- .NET 运行时和程序集缓存在浏览器中。
Blazor WebAssembly 托管模型具有以下优点:
- 对于独立 Blazor WebAssembly 应用,从服务器下载应用后,没有 .NET 服务器端依赖项,因此,如果服务器脱机,应用将保持正常运行。
- 可充分利用客户端资源和功能。
- 工作可从服务器转移到客户端。
- 对于独立 Blazor WebAssembly 应用,无需 ASP.NET Core Web 服务器即可托管应用。 无服务器部署方案可行,例如通过内容分发网络 (CDN) 为应用提供服务的方案。
Blazor WebAssembly 托管模型具有以下局限性:
- Razor 组件仅可使用浏览器功能。
- 需要可用的客户端硬件和软件(例如 WebAssembly 支持)。
- 下载项大小较大,组件加载耗时较长。
- 发送到客户端的代码无法防止用户进行检查和篡改。
.NET 中间语言 (IL) 解释器包括部分实时 (JIT) 运行时支持,以提高运行时性能。 JIT 解释器通过将解释器字节码替换为 WebAssembly 代码的小型 blob 来优化解释器字节码的执行。 除非调试,否则会自动为 Blazor WebAssembly 应用启用 JIT 解释器。
Blazor 支持预先 (AOT) 编译,你可以直接将 .NET 代码编译到 WebAssembly 中。 AOT 编译会提高运行时性能,代价是应用大小增加。 有关详细信息,请参阅 ASP.NET Core Blazor WebAssembly 生成工具和预先 (AOT) 编译。
用于 AOT 编译的相同 .NET WebAssembly 生成工具也会重新链接 .NET WebAssembly 运行时,以剪裁未使用的运行时代码。 Blazor 还会剪裁 .NET Framework 库中未使用的代码。 .NET 编译器进一步预压缩独立 Blazor WebAssembly 应用,以达到更小的应用有效负载。
WebAssembly 呈现的 Razor 组件可以使用生成的本机依赖项在 WebAssembly 上运行。
Blazor WebAssembly 支持剪裁 .NET Core 框架库中未使用的代码。 有关详细信息,请参阅 ASP.NET Core Blazor 全球化和本地化。
Blazor Hybrid
Blazor 还可用于使用混合方法生成本机客户端应用。 混合应用是利用 Web 技术实现其功能的本机应用。 在 Blazor Hybrid 应用中,Razor 组件与任何其他 .NET 代码一起直接在本机应用中(而不在 WebAssembly 上)运行,并通过本地互操作通道基于 HTML 和 CSS 将 Web UI 呈现到嵌入式 Web View 控件。
可以使用不同的 .NET 本机应用框架(包括 .NET MAUI、WPF 和 Windows 窗体)生成 Blazor Hybrid 应用。 Blazor 提供 BlazorWebView
控件,将 Razor 组件添加到使用这些框架生成的应用。 通过结合使用 Blazor 和 .NET MAUI,可以便捷地生成适用于移动和桌面的跨平台 Blazor Hybrid 应用,而将 Blazor 与 WPF 和 Windows 窗体集成可以更好地实现现有应用的现代化。
由于 Blazor Hybrid 应用是本机应用,它们可以支持只有 Web 平台所没有的功能。 通过正常的 .NET API,Blazor Hybrid 应用对本机平台功能具有完全访问权限。 Blazor Hybrid 应用还可以与现有 Blazor Server 或 Blazor WebAssembly 应用共享和重复使用组件。 Blazor Hybrid 应用结合了 Web、本机应用和 .NET 平台的优点。
Blazor Hybrid 托管模型具有以下优点:
- 重复使用可在移动、桌面和 Web 之间共享的现有组件。
- 利用 Web 开发技能、体验和资源。
- 应用对设备的本机功能具有完全访问权限。
Blazor Hybrid 托管模型具有以下局限性:
- 必须为每个目标平台生成、部署和维护单独的本机客户端应用。
- 与在浏览器中访问 Web 应用相比,查找、下载和安装本机客户端应用通常需要更长的时间。
有关详细信息,请参阅 ASP.NET Core Blazor Hybrid。
有关 Microsoft 本机客户端框架的详细信息,请参阅以下资源:
应选择哪个 Blazor 托管模型?
组件的托管模型由其呈现模式在编译时或运行时进行设置,ASP.NET Core Blazor 呈现模式中的示例对该内容进行了介绍。 下表显示了设置呈现模式以确定组件的托管模型的主要注意事项。 对于独立 Blazor WebAssembly 应用,所有应用的组件都使用 Blazor WebAssembly 托管模型呈现在客户端上。
根据应用的功能要求选择 Blazor 托管模型。 下表显示了选择托管模型的主要注意事项。
Blazor Hybrid 应用包括 .NET MAUI、WPF 和 Windows 窗体框架应用。
功能 | Blazor Server | Blazor WebAssembly (WASM) | Blazor Hybrid |
---|---|---|---|
与 .NET API 完全兼容 | 支持 | 不支持 | 支持 |
直接访问服务器和网络资源 | 支持 | 不支持† | 不支持† |
较小的有效负载,较快的初始加载速度 | 支持 | 不支持 | 不支持 |
接近本机执行速度 | 支持 | 支持‡ | 支持 |
服务器上安全且专用的应用代码 | 支持 | 不支持† | 不支持† |
下载后即可脱机运行应用 | 不支持 | 支持 | 支持 |
静态站点托管 | 不支持 | 支持 | 不支持 |
将处理过程转移至客户端 | 不支持 | 支持 | 支持 |
对本机客户端功能具有完全访问权限 | 不支持 | 不支持 | 支持 |
基于 Web 的部署 | 支持 | 支持 | 不支持 |
†Blazor WebAssembly 和 Blazor Hybrid 应用可以使用基于服务器的 API 来访问服务器/网络资源并访问专用和安全的应用代码。
‡Blazor WebAssembly 仅通过预先 (AOT) 编译达到接近本机性能。
Feature | Blazor Server | Blazor WebAssembly (WASM) |
---|---|---|
与 .NET API 完全兼容 | 支持 | 不支持 |
直接访问服务器和网络资源 | 支持 | 不支持† |
较小的有效负载,较快的初始加载速度 | 支持 | 不支持 |
服务器上安全且专用的应用代码 | 支持 | 不支持† |
下载后即可脱机运行应用 | 不支持 | 支持 |
静态站点托管 | 不支持 | 支持 |
将处理过程转移至客户端 | 不支持 | 支持 |
†Blazor WebAssembly 应用可以使用基于服务器的 API 来访问服务器/网络资源并访问专用和安全的应用代码。
选择应用的托管模型后,可以从 Blazor 项目模板生成 Blazor Server 或 Blazor WebAssembly 应用。 有关详细信息,请参阅用于 ASP.NET Core Blazor 的工具。
若要创建 Blazor Hybrid 应用,请参阅 ASP.NET Core Blazor Hybrid 教程下的文章。
与 .NET API 完全兼容
为 Blazor Server 托管模型和 Blazor Hybrid 应用呈现的组件与 .NET API 完全兼容,而为 Blazor WebAssembly 呈现的组件仅与 .NET API 的子集兼容。 如果应用的规范要求使用一个或多个对 WebAssembly 呈现的组件不可用的 .NET API,请选择呈现 Blazor Server 组件或使用 Blazor Hybrid。
Blazor Server 和 Blazor Hybrid 应用与 .NET API 完全兼容,而 Blazor WebAssembly 应用仅与一部分 .NET API 兼容。 如果应用的规范要求使用一个或多个 Blazor WebAssembly 应用不可用的 .NET API,请选择 Blazor Server 或 Blazor Hybrid。
Blazor Server 应用与 .NET API 完全兼容,而 Blazor WebAssembly 应用仅与一部分 .NET API 兼容。 如果应用的规范要求使用一个或多个 Blazor WebAssembly 应用不可用的 .NET API,请选择 Blazor Server。
直接访问服务器和网络资源
为 Blazor Server 托管模型呈现的组件可以直接访问执行应用的服务器和网络资源。 由于使用 Blazor WebAssembly 或 Blazor Hybrid 托管的组件在客户端上执行,因此它们不能直接访问服务器和网络资源。 组件可以通过基于服务器的受保护 API 间接访问服务器和网络资源。 基于服务器的 API 可通过第三方库、包和服务获得。 考虑以下注意事项:
- 第三方库、包和服务的实现和维护成本可能很高,它们的支持可能较弱,或者可能带来安全风险。
- 如果组织在内部开发一个或多个基于服务器的 API,则需要额外的资源来构建和维护它们。
使用 Blazor Server 托管模型避免从服务器环境公开 API。
Blazor Server 应用可以在应用执行时直接访问服务器和网络资源。 由于 Blazor WebAssembly 和 Blazor Hybrid 应用在客户端上执行,因此它们不能直接访问服务器和网络资源。 Blazor WebAssembly 和 Blazor Hybrid 应用可以通过基于服务器的受保护 API 间接访问服务器和网络资源。 基于服务器的 API 可通过第三方库、包和服务获得。 考虑以下注意事项:
- 第三方库、包和服务的实现和维护成本可能很高,它们的支持可能较弱,或者可能带来安全风险。
- 如果组织在内部开发一个或多个基于服务器的 API,则需要额外的资源来构建和维护它们。
若要避免为 Blazor WebAssembly 或 Blazor Hybrid 应用使用基于服务器的 API,请采用 Blazor Server,它可以直接访问服务器和网络资源。
Blazor Server 应用可以在应用执行时直接访问服务器和网络资源。 由于 Blazor WebAssembly 应用在客户端上执行,因此它们不能直接访问服务器和网络资源。 Blazor WebAssembly 应用可以通过基于服务器的受保护 API 间接访问服务器和网络资源。 基于服务器的 API 可通过第三方库、包和服务获得。 考虑以下注意事项:
- 第三方库、包和服务的实现和维护成本可能很高,它们的支持可能较弱,或者可能带来安全风险。
- 如果组织在内部开发一个或多个基于服务器的 API,则需要额外的资源来构建和维护它们。
若要避免为 Blazor WebAssembly 应用使用基于服务器的 API,请采用 Blazor Server,它可以直接访问服务器和网络资源。
较小的有效负载,较快的初始加载速度
从服务器呈现组件可减少应用有效负载大小并优化初始加载时间。 如果需要较短的初始加载时间,请使用 Blazor Server 托管模型或考虑静态服务器端呈现。
Blazor Server 应用的有效负载大小相对较小,初始加载时间较短。 如果需要较短的初始加载时间,请采用 Blazor Server。
接近本机执行速度
Blazor Hybrid 应用在目标平台上以本机方式使用 .NET 运行时运行,可提供最佳速度。
为 Blazor WebAssembly 托管模型呈现的组件(包括渐进式 Web 应用 (PWA))和独立 Blazor WebAssembly 应用使用适用于 WebAssembly 的 .NET 运行时运行,这比直接在平台上运行要慢。 请考虑使用已编译的 AOT (ahead-of-time),以提高使用 Blazor WebAssembly 时的运行时性能。
Blazor Hybrid 应用在目标平台上以本机方式使用 .NET 运行时运行,可提供最佳速度。
Blazor WebAssembly(包括渐进式 Web 应用 (PWA))应用使用适用于 WebAssembly 的 .NET 运行时运行,这比直接在平台上运行慢,甚至对于在浏览器中为 WebAssembly 预先 (AOT) 编译的应用也是如此。
Blazor Server 应用通常在服务器上快速执行。
Blazor WebAssembly 应用使用适用于 WebAssembly 的 .NET 运行时运行,这比直接在平台上运行的速度要慢。
服务器上安全且专用的应用代码
在服务器上安全且私密地维护应用代码是为 Blazor Server 托管模型呈现的组件的内置功能。 使用 Blazor WebAssembly 或 Blazor Hybrid 托管模型呈现的组件可以使用基于服务器的 API 来访问必须保持专用性和安全性的功能。 有关开发和维护基于服务器的 API 的注意事项,请参阅直接访问服务器和网络资源部分。 如果基于服务器的 API 的开发和维护并不适合维护安全和专用的应用代码,请为 Blazor Server 托管模型呈现组件。
在服务器上安全且私密地维护应用代码是 Blazor Server 的一个内置功能。 Blazor WebAssembly 和 Blazor Hybrid 应用可以使用基于服务器的 API 来访问必须保持专用和安全的功能。 有关开发和维护基于服务器的 API 的注意事项,请参阅直接访问服务器和网络资源部分。 如果基于服务器的 API 的开发和维护并不适合维护安全和专用应用代码,请采用 Blazor Server 托管模型。
在服务器上安全且私密地维护应用代码是 Blazor Server 的一个内置功能。 Blazor WebAssembly 应用可以使用基于服务器的 API 来访问必须保持专用和安全的功能。 有关开发和维护基于服务器的 API 的注意事项,请参阅直接访问服务器和网络资源部分。 如果基于服务器的 API 的开发和维护并不适合维护安全和专用应用代码,请采用 Blazor Server 托管模型。
下载后即可脱机运行应用
构建为渐进式 Web 应用 (PWA) 的独立 Blazor WebAssembly 应用和 Blazor Hybrid 应用可以脱机运行,这在客户端无法连接到 Internet 时特别有用。 当与服务器的连接丢失时,为 Blazor Server 托管模型呈现的组件无法运行。 如果应用必须脱机运行,则独立 Blazor WebAssembly 和 Blazor Hybrid 是最佳选择。
构建为渐进式 Web 应用 (PWA) 的 Blazor WebAssembly 应用和 Blazor Hybrid 应用可以脱机运行,这在客户端无法连接到 Internet 时特别有用。 当与服务器的连接断开时,Blazor Server 应用无法运行。 如果应用必须脱机运行,则 Blazor WebAssembly 和 Blazor Hybrid 是最佳选择。
Blazor WebAssembly 应用可以脱机运行,这在客户端无法连接到 Internet 时特别有用。 当与服务器的连接断开时,Blazor Server 应用无法运行。 如果应用必须脱机运行,则 Blazor WebAssembly 是最佳选择。
静态站点托管
静态站点托管可用于独立 Blazor WebAssembly 应用,因为这些应用是作为一组静态文件下载到客户端的。 独立 Blazor WebAssembly 应用不需要服务器执行服务器端代码即可下载和运行,并且可以通过内容分发网络 (CDN)(例如 Azure CDN)分发。
尽管 Blazor Hybrid 应用编译为一个或多个独立部署资产,但这些资产通常通过第三方应用商店提供给客户。 如果静态托管是应用要求,请选择独立 Blazor WebAssembly。
将处理过程转移至客户端
使用 Blazor WebAssembly 或 Blazor Hybrid 托管模型呈现的组件在客户端上执行,因此会将处理卸载到客户端。 为 Blazor Server 托管模型呈现的组件在服务器上执行,因此服务器资源需求通常随用户数量和每个用户所需的处理量而增加。 如果可将某个应用的大部分或全部处理卸载到客户端,而该应用处理大量数据,那么 Blazor WebAssembly 或 Blazor Hybrid 是最佳选择。
Blazor WebAssembly 和 Blazor Hybrid 应用在客户端上执行,因此将处理卸载到客户端。 Blazor Server 应用在服务器上执行,因此服务器资源需求通常随用户数量和每个用户所需的处理量而增加。 如果可将某个应用的大部分或全部处理卸载到客户端,而该应用处理大量数据,那么 Blazor WebAssembly 或 Blazor Hybrid 是最佳选择。
Blazor WebAssembly 应用在客户端上执行,因此将处理卸载到客户端。 Blazor Server 应用在服务器上执行,因此服务器资源需求通常随用户数量和每个用户所需的处理量而增加。 如果可将某个应用的大部分或全部处理卸载到客户端,而该应用处理大量数据,那么 Blazor WebAssembly 是最佳选择。
对本机客户端功能具有完全访问权限
Blazor Hybrid 应用可通过 .NET 本机应用框架完全访问本机客户端 API 功能。 在 Blazor Hybrid 应用中,Razor 组件直接在本机应用中运行,而不是在 WebAssembly 上运行。 当需要完整的客户端功能时,Blazor Hybrid 是最佳选择。
基于 Web 的部署
Blazor Web 应用将在应用下次在浏览器中刷新时更新。
Blazor Hybrid 应用是通常需要安装程序和特定于平台的部署机制的本机客户端应用。
设置组件的托管模型
若要在编译时或在运行时动态将组件的托管模型设置为 Blazor Server 或 Blazor WebAssembly,请设置其呈现模式。 ASP.NET Core Blazor 呈现模式一文中已详细说明和演示了呈现模式。 不建议跳过这两篇文章之间的文章内容,直接从本文跳转到呈现模式一文。 例如,你可以通过查看 Razor 组件示例更轻松地理解呈现模式,但在阅读 ASP.NET Core Blazor 基础知识一文之前,你将无法了解基本 Razor 组件结构和功能。 在使用呈现模式一文中的组件示例之前,了解 Blazor 的项目模板和工具也很有帮助。