预渲染 Blazor WebAssembly 的正确方法是什么？

Question

经过以下步骤几乎可以工作：

1. 安装托管版本的blazorwasm 模板应用程序。

   dotnet new blazorwasm --hosted -o HostedWasm
   

2. 将_Hosted.cshtml 从blazorserver 模板复制到Pages 文件夹。
3. 在服务器的Startup.cs 中将endpoints.MapFallbackToFile("index.html") 更改为endpoints.MapFallbackToPage("/_Host")
4. 在_Host.cshtml 中将<script src="_framework/blazor.server.js"></script> 更改为<script src="_framework/blazor.webassembly.js"></script>

现在，如果您dotnet run 服务器，您将能够使用预呈现的 HTML 浏览模板页面。

但是，我有两个问题：

1. 这是进行 Blazor WebAssembly 预呈现的“正确”方式吗？我在文档中对此一无所知。
2. 如何在服务器端和客户端之间共享 DI？现在，如果您导航/，然后转到/fetchdata，一切都会好起来的，但是如果您随后在/fetchdata 路径上使用F5（例如刷新），您会看到

InvalidOperationException：无法为属性“Http”提供值 在类型“HostedWasm.Client.Pages.FetchData”上。没有注册 'System.Net.Http.HttpClient' 类型的服务。

要修复它，您需要将 HttpClient 配置代码从 Client/Program.cs 复制到 Server/Startup.cs p>

Answer 1

Andrew Lock 的优秀博文Enabling prerendering for Blazor WebAssembly apps 给出了最好的说明，IMO。在这里重复他的步骤：

1. 添加_主机页面，dotnet new page -o Pages -n _Host --no-pagemodel
2. 将 Client/wwwroot/index.html 复制到其中，将 @page 保留在顶部
3. 添加标签助手，@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
4. 将<div id="app"> 替换为<component type="typeof(BlazorApp1.App)" render-mode="WebAssemblyPrerendered" />
5. 从 Program.cs 中删除 builder.RootComponents.Add<App>("#app")
6. 向服务器添加一个 http 客户端，例如services.AddSingleton<HttpClient>。

他继续链接到其他博客文章，这些文章讨论了处理丢失的 HttpClient 问题的“权利”。我认为只注入客户是“正确”的方法。这是一个简单的解决方案。该应用程序仅在服务器上运行几秒钟。预渲染的应用程序无论如何都不是交互式的，因此用户不会点击一堆。