.net - Angular 清除浏览器缓存

Question

在发布我的 Angular 应用程序的新版本后，我经常看到旧的缓存版本，直到我按 Ctrl+F5 将其清除。为避免我在 Angular 应用程序中有一个与 .net 核心 api 项目版本匹配的版本号。在登录页面中，我调用 api 来获取版本，如果不匹配，我触发 window.reload(true)。这种方法好还是有更好/更简单的方法？

Answer 1

在 angular.json 中有 configurations 部分，其中包含 production 配置。在这里，您可以将 outputHashing 设置为值 all 并且如果您调用 ng build --prod 构建的文件名将在他 dist 文件夹。如果文件的内容在版本更新后发生变化，则哈希将有所不同，随后将被下载。

一个例子:

"configurations": {
  "production": {
    "fileReplacements": [
      {
        "replace": "src/environments/environment.ts",
        "with": "src/environments/environment.prod.ts"
      }
    ],
    "optimization": true,
    "outputHashing": "all",
    "sourceMap": false,
    "extractCss": true,
    "namedChunks": false,
    "aot": true,
    "extractLicenses": true,
    "vendorChunk": false,
    "buildOptimizer": true
  }
}

可以找到有关引用构建参数的文档 here .

然而，index.html 本身可能会被缓存(其文件名未经过哈希处理)并且不会下载具有新哈希值的内容，因为浏览器使用缓存的 index.html 缓存的 Angular 内容。在这种情况下，index.html 应由具有 no-cache、no-store http header 属性的 .NET 后端提供。缓存控制详解here .