Pat*_*ski 11 css browser-cache blazor-client-side blazor-webassembly
我读了这篇文章，但仍然遇到问题：
我有我的 Blazor WebAssembly 站点，其中有一个静态 index.html 文件，可以以正常方式引导 Blazor。在其中<head>，我有<link href="css/app.min.css" rel="stylesheet" />。该文件是使用部署时的 Dockerfile RUN 步骤从 SCSS 构建的。
根据该问题，我不需要缓存清除 URL，因为 Blazor 会根据需要自动请求一个新的 URL。然而，当我部署站点并在 Firefox 中打开它时，我得到了旧样式，并在 Firefox 开发人员工具网络选项卡中看到 app.min.css 是从磁盘缓存中检索的。我必须按 Ctrl+F5 才能获取新样式。
那么这个链条到底出了什么问题呢？在我看来，每次部署时我仍然需要 CSS 的缓存清除 URL。 需要进行哪些设置才能在站点二进制文件更改时下载我的 CSS（按照 Steve Sanderson 在该问题中建议的方式）？
虽然在这方面起步较晚，但有了新的.Net 6 HeadOutlet 组件，您现在可以更轻松地进行配置。对于我的特定情况，我想从文件配置 CSS 版本appsettings.json（该值设置为 CI/CD 构建时间）。为了实现这一目标，我需要能够读取IConfiguration. 如果这不是必需的，您此时可以使用任何 C# 代码来派生您的“版本”。我决定将其放入我的App.razor文件中，这样我只需配置一次。App.razor这是我的外观的一个片段。
@using Microsoft.Extensions.Configuration
@inject IConfiguration Configuration
<HeadContent>
<link href="css/app.css?@(Configuration["BuildNumber"])" rel="stylesheet" />
</HeadContent>
<Router AppAssembly="@typeof(Program).Assembly" PreferExactMatches="@true">
<Found Context="routeData">
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
</Found>
<NotFound>
<LayoutView Layout="@typeof(MainLayout)">
<p>Sorry, there's nothing at this address.</p>
</LayoutView>
</NotFound>
</Router>
这种方法的一个小缺点意味着您需要分离默认的 Blazor CSS 样式（如果您使用它们），因为在 Blazor 框架接管应用程序之前不会加载这些样式。另外，不要忘记添加HeadOutlet到您的 WebAssembly 项目中Program.cs。
builder.RootComponents.Add<HeadOutlet>("head::after");