非PWA模式下Blazor WebAssembly(.NET Core托管)强制更新缓存方案咨询

1. 内置版本检查主动触发更新 #

Blazor WASM自带版本检查能力，可在应用初始化时对比本地与服务器版本，触发刷新：

• 在Program.cs中添加逻辑：

var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");

var host = builder.Build();
var httpClient = host.Services.GetRequiredService<HttpClient>();

// 获取当前程序集版本
var currentVersion = typeof(Program).Assembly.GetName().Version?.ToString() ?? "";
// 从服务器读取预先部署的版本文件内容
var latestVersion = await httpClient.GetStringAsync("version.txt");

if (!string.Equals(currentVersion, latestVersion, StringComparison.Ordinal))
{
    if (confirm("检测到应用更新，是否立即刷新获取新版本？"))
    {
        window.location.reload(true);
    }
}

await host.RunAsync();

• 部署时，每次更新都同步修改wwwroot/version.txt内的版本号，与程序集版本保持一致。

2. 针对核心文件配置精准缓存策略 #

之前缓存头失效可能是未覆盖Blazor关键文件，需对以下资源设置严格缓存规则：

• IIS环境：在web.config中添加

<location path="_framework">
  <system.webServer>
    <staticContent>
      <clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="00:05:00" />
    </staticContent>
  </system.webServer>
</location>
<location path="index.html">
  <system.webServer>
    <staticContent>
      <clientCache cacheControlMode="NoCache" />
    </staticContent>
  </system.webServer>
</location>

• Kestrel环境：在服务器端Program.cs配置

app.UseStaticFiles(new StaticFileOptions
{
    OnPrepareResponse = ctx =>
    {
        var path = ctx.Context.Request.Path;
        if (path.StartsWithSegments("/_framework"))
        {
            ctx.Context.Response.Headers.Append("Cache-Control", "public, max-age=300, must-revalidate");
        }
        else if (path == "/index.html")
        {
            ctx.Context.Response.Headers.Append("Cache-Control", "no-cache, no-store, must-revalidate");
            ctx.Context.Response.Headers.Append("Pragma", "no-cache");
            ctx.Context.Response.Headers.Append("Expires", "0");
        }
    }
});

注：blazor.boot.json是DLL加载入口，必须确保浏览器能获取最新版本，它包含的DLL哈希值是浏览器判断是否下载新文件的核心依据

3. 确保DLL自动生成哈希后缀 #

Blazor默认会为构建后的DLL添加内容哈希后缀，若失效需检查项目配置：

• 在.csproj中确认以下配置存在：

<PropertyGroup>
  <UseStaticWebAssets>true</UseStaticWebAssets>
  <BlazorWebAssemblyEnableLinking>true</BlazorWebAssemblyEnableLinking>
</PropertyGroup>

构建后DLL会以MyApp.dll?hash=xxx形式存在，文件内容变化时哈希自动更新，浏览器会主动下载新文件。

4. 极简Service Worker清除旧缓存 #

无需启用完整PWA，可注册极简Service Worker仅负责清除旧缓存：

• 在wwwroot创建sw.js：

self.addEventListener('fetch', event => {
  event.respondWith(fetch(event.request));
});

self.addEventListener('activate', event => {
  event.waitUntil(
    caches.keys().then(cacheNames => {
      return Promise.all(
        cacheNames.map(cacheName => caches.delete(cacheName))
      );
    })
  );
});

• 在index.html中注册（仅生产环境）：

<script>
  if (navigator.serviceWorker) {
    navigator.serviceWorker.register('/sw.js');
  }
</script>

部署更新后，新Service Worker激活时会清除所有旧缓存，触发浏览器重新加载资源。

内容的提问来源于stack exchange，提问作者Arc.NET