Blazor WASM自托管部署Azure App Service后强制清缓存方案咨询

一、Azure 门户配置缓存策略 #

• 进入目标App Service的「配置」→「应用程序设置」，新增以下键值对：
  • 键：ASPNETCORE_SPA_STATIC_FILES_CACHE_CONTROL，值：no-cache, no-store, must-revalidate —— 强制浏览器每次请求都重新验证文件，彻底避免旧缓存
  • 若不想完全禁用缓存，可改用public, max-age=0, must-revalidate —— 允许浏览器缓存，但每次请求都会向服务器确认文件是否更新
• 同时在「配置」→「常规设置」中，将「HTTP版本」设为2.0及以上，确保缓存协商头部正常生效

二、项目内编程控制缓存与更新检测 #

1. 后端静态文件缓存配置（Server项目） #

在.NET 6+的Program.cs中，修改静态文件中间件的缓存规则：

app.UseStaticFiles(new StaticFileOptions
{
    OnPrepareResponse = ctx =>
    {
        // 针对Blazor WASM的静态资源设置缓存头部
        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");
    }
});

2. 前端自动更新检测（WASM项目） #

在WASM项目的Program.cs中添加自动检查更新逻辑，每次导航时验证是否有新版本：

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

var host = builder.Build();
var navManager = host.Services.GetRequiredService<NavigationManager>();
var env = host.Services.GetRequiredService<IWebAssemblyHostEnvironment>();
var httpClient = host.Services.GetRequiredService<HttpClient>();

// 生产环境下，每次导航检查更新
if (!env.IsDevelopment())
{
    navManager.LocationChanged += async (_, __) =>
    {
        var bootResponse = await httpClient.GetAsync("_framework/blazor.boot.json", HttpCompletionOption.ResponseHeadersRead);
        if (bootResponse.IsSuccessStatusCode)
        {
            var serverETag = bootResponse.Headers.ETag?.Tag?.Trim('"');
            var localHash = env.WebRootFilesHash;
            
            if (!string.IsNullOrEmpty(serverETag) && serverETag != localHash)
            {
                // 检测到新版本，强制刷新页面加载最新内容
                navManager.NavigateTo(navManager.Uri, forceLoad: true);
            }
        }
    };
}

await host.RunAsync();

三、发布时启用静态文件版本化 #

在Server项目的.csproj文件中添加配置，让静态文件发布时带上哈希后缀，浏览器会自动识别为新资源：

<PropertyGroup>
    <!-- 替换为你的WASM项目名称 -->
    <StaticWebAssetBasePath>_content/YourWasmProjectName</StaticWebAssetBasePath>
    <EnableDefaultContentItems>false</EnableDefaultContentItems>
</PropertyGroup>

四、Azure CDN 优化（若已配置） #

如果使用了Azure CDN加速静态资源：

• 在CDN的「缓存规则」中，对_framework/*和wwwroot/*路径设置短缓存过期时间（比如5分钟）
• 启用「查询字符串缓存」，发布时给资源URL添加版本号参数（如?v=20240520），确保CDN返回最新资源

内容的提问来源于stack exchange，提问作者Wilton