.Net Core Angular 5网站中的缓存清除index.html

Question

我正在使用.Net core和angular 5创建一个网站。我使用最新的.Net core angular template（dotnet new angular与安装的.Net core 2.1一起使用）创建了该项目。

该项目使用angular cli来构建/打包并将哈希应用于绑定的js和css文件：

但是，将网站发布到azure应用程序服务后，我发现当浏览到该网站时，会看到旧版本，直到用F5手动刷新（不需要Ctrl-F5）。这似乎是因为尽管js / css文件不会被缓存，但包含这些文件引用的index.html页面将从缓存中提供。

当我按F5重新加载网站时，home从网站请求index.html（以下）（本例中为304，因为它没有更改，如果有，它将获取最新的）：

但是，当我最初加载页面（通过书签或输入地址等）时，直接从缓存中提供页面：

这是预期的行为吗？为什么第一次加载页面与按F5相比有何不同？并且我可以防止缓存吗？

Answer 1

这是我结合了很多答案后得出的结论。我的目标是永远不要缓存index.html。当我在那儿时，由于Angular很好地缓存js和css文件，因此我让它缓存了所有其他资产一年。

只要确保您对要在Angular之外管理的资产（例如图像）使用缓存清除机制。

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
  // ...
  app.UseStaticFiles();

  if (env.IsDevelopment())
  {
    // no caching
    app.UseSpaStaticFiles();
  }
  else
  {
    app.UseSpaStaticFiles(new StaticFileOptions
    {
      OnPrepareResponse = context =>
      {
        context.Context.Response.Headers.Add("Cache-Control", "max-age=31536000");
        context.Context.Response.Headers.Add("Expires", "31536000");
      }
    });
  }

  // ...

  app.UseSpa(spa =>
  {
    spa.Options.DefaultPageStaticFileOptions = new StaticFileOptions
    {
      OnPrepareResponse = context =>
      {
        // never cache index.html
        if (context.File.Name == "index.html")
        {
          context.Context.Response.Headers.Add("Cache-Control", "no-cache, no-store");
          context.Context.Response.Headers.Add("Expires", "-1");
        }
      }
    };
  });
}

其他StackOverflow的答案：禁用缓存在.net核心 | 缓存一年

Answer 2

这不是一个简洁或完美的解决方案，但这似乎有效，并且可能会让人们走上正确的道路：

在 Startup.cs 的配置（）中我添加了这个

app.Use(async (c, next) =>
{
    if (c.Request.Path == "/")
    {
        c.Response.Headers.Add("Cache-Control", "no-store,no-cache");
        c.Response.Headers.Add("Pragma", "no-cache");
    }
    await next();
});

自从添加此内容以来，我一直无法重现我的问题。