ASP.NET Core - Web API 中 SPA 路由的缓存问题答案

【问题标题】：ASP.NET Core - Cache problems with SPA route in Web APIASP.NET Core - Web API 中 SPA 路由的缓存问题
【发布时间】：2017-12-14 20:41:08
【问题描述】：

好的，我不太确定缓存的确切问题是什么，但我倾向于在我的 WebAPI 中使用我的 SPA 路由回退。抱歉发了一篇相当混乱的帖子，我知道缓存破坏是 SO 和博客上的热门话题，但我就是找不到解决问题的方法。

首先简要概述解决方案。我正在使用 webpack 将我的前端代码捆绑成或多或少的一个 css、一个 js 和一个 index.html。我 100% 确定这个 index.html 引用了这些唯一的 css 和 js 文件，并且每个构建/发布的哈希值都是唯一的。 Webpack 将这些文件复制到我的 ASP.NET Core 项目和 wwwroot 目录中。在我的 ASP.NET Core 代码中，我设置了 MVC 路由，如下所示：

app.UseMvc(routes =>
{
  routes.MapRoute("api", "api/{controller=Controller}/{action=Index}/{id?}");
  routes.MapRoute("default", "{*url}", new {controller = "Home", action = "RedirectIndex"});
});

主控制器和索引操作执行以下操作：

public ActionResult RedirectIndex()
{
  return new PhysicalFileResult(Path.Combine(_hostingEnvironment.WebRootPath, "index.html"), new MediaTypeHeaderValue("text/html"));
}

我也使用 app.UseDefaultFiles();和 app.UseStaticFiles();在我的 Startup.cs 但没有缓存控制。

这是托管在 Azure 上的 Web 应用程序中。

当我像这样导航到我的应用程序时：https://my-app.com/ 然后默认路由启动，我得到了我的 index.html。一切都按预期工作。除了我得到一个缓存的 index.html 引用我的旧 js 和旧 css 文件。

注意！我不会从 Azure 托管站点中删除我的旧 js 和 css 文件，因此当缓存的 index.html 引用旧文件时 - 它们会毫无问题地得到服务。

由于 index.html 被缓存，我的用户获得了旧版本的 js 逻辑，但服务器已更新，因此我的 web api 发送了 js 无法处理的更新内容 - 我遇到了崩溃。我必须告诉我的用户按 ctrl + shift + r 进行硬刷新，然后一切正常。

还有最后一块拼图。当我注销时，我将用户重定向到 auth0（身份验证服务）以执行注销。该服务（auth0）然后将用户重定向回我的站点（https://my-app.com/）并猜猜是什么 - 他们再次获得旧的缓存 index.html，即使他们只是 ctrl+shift+r 刷新了同一个站点几分钟早一点。

我对此感到非常困惑 - 是浏览器 (Chrome) 执行此缓存吗？是我使用 PhysicalFileResult() 进行的神奇 SPA 路由重定向吗？是蔚蓝吗？我是否应该在每次构建时重命名我的 index.html 并引用那个唯一的 index.html？（这将是一个显而易见的解决方案，但是我的 webpack 配置需要操纵我的 C# 服务器代码，这让我毛骨悚然）

【问题讨论】：

我认为您可以在RedirectIndex 控制器操作上设置[ResponseCache(NoStore =true, Location =ResponseCacheLocation.None)]。

标签： asp.net azure caching webpack single-page-application

【解决方案1】：

经过进一步调查，我得出结论，当指定文件（index.html）没有缓存控制标头时，一定是浏览器通过某些内置自定义逻辑进行缓存。或者可能是 Azure Web 服务器添加了这个？

Chrome 为 index.html 指示状态代码 304（未修改），即使它已通过 Azure 中的插槽交换进行了修改。我尝试使用 FTP 客户端修改文件，并且在重新加载和状态码 200 后给了我新版本。但是当将新版本发布到阶段插槽（使用新 index.html）时，我仍然收到旧版本舞台环境和状态码304。也许这是因为我停止了站点，发布然后重新启动它（？？）。当我将舞台插槽交换到生产插槽时，生产 index.html 再次更新，但 Chrome 在重新加载后对生产环境表示 304（未修改）。 Ctrl+Shift+R 总能解决这个问题。

无论如何。这个公认的答案似乎解决了这个问题：https://stackoverflow.com/a/38235096

即使我使用稍微自定义的 PhysicalFileResult()，StaticFilesOptions() 也会启动，并且每次重新加载都会得到 200 个状态代码。我的 index.html 非常小，所以这是完全可以的解决方案。

希望这对其他人有所帮助。

【讨论】：