Blazor Web 应用程序项目

Question

当我创建一个新的 Blazor Web 应用程序项目时，它要求我选择交互式渲染模式，如果我选择自动（服务器和 WebAssembly），它会创建 2 个项目，1 个用于服务器，1 个用于客户端。

好像服务器项目有razor页面，客户端项目有razor页面，那么，有什么区别呢？什么样的代码需要放在服务器项目中，什么样的代码应该放在客户端项目中。

如果我有一个返回城市列表的 API 方法，该 api 方法应该添加为服务器项目内的控制器（CityController.cs 和方法 GetCities）？然后客户端项目注入 HTTP 服务并调用 GetCities？

虽然我得到服务器项目通过 signal-R 使用服务器端渲染，但我试图在低级别理解进入每个项目的代码类型（换句话说，在什么用例中应该使用服务器、WebAssembly 或 Auto渲染模式选项？）

例如，如果我想构建一个显示网格、来自 API 方法的图表数据的仪表板，并且需要创建 API 方法的一部分，则需要创建什么类型的 blazor 项目。

Answer 1

一个页面可以设置 4 种渲染模式。 https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0。

SSR（也称为预渲染）页面需要在“服务器项目”中进行处理。
InteractiveServer（使用SignalR，当禁用预渲染时）页面需要在“服务器项目”中处理。
InteractiveWebAssembly（禁用预渲染时）页面需要在“客户端项目”中处理。
InteractiveAuto（禁用预渲染时）页面需要在“服务器项目”和“客户端项目”中处理。

首先要澄清的是“服务器项目”对“客户端项目”有依赖引用，因此服务器可以使用客户端中的所有页面资源。所以你肯定可以将所有渲染模式页面放在“客户端项目”中。

但相比之下，您不能将 InteractiveWebAssembly 和 InteractiveAuto 页面放入服务器项目中。因为“客户端项目”没有对“服务器项目”的依赖引用。所以只有SSR和IneractiveServer页面可以放入“服务器项目”中。

“然后客户端项目注入 HTTP 服务并调用 GetCities？”
你是对的，你可以在“服务器项目”中添加控制器，就像 webapi 程序一样。 “InteractiveWeb assembly”模式下的页面可以被视为纯粹的“前端”来获取后端 api。服务需要根据渲染模式在“处理项目”中注册。当然，自动模式页面需要在两个项目中注册服务。

“在什么用例中应该使用服务器、WebAssembly 或自动渲染模式选项？”
为了快速开发，我会选择server模式。如果一开始就选择，则只有1个服务器项目。您无需关心前后处理问题。缺点是当用户访问过多时，signalR会消耗硬件。并且需要更好的网络，有时用户可能会出现“信号断开”的问题。
WebAssembly 不消耗服务器硬件，因此可以容纳更多用户。但第一次加载时间很烦人。
自动模式是为了解决双方的问题。它使用服务器模式，直到 WebAssembly 资源完成下载。根据您的需要，我建议您使用自动模式。

您可以检查渲染模式在页面中如何变化，如下所示：https://stackoverflow.com/a/78180059/20240963