在 Angular 7 中进行生产构建后，缓存破坏有时不起作用 [英] Cache busting is not working sometimes after production build in angular 7

问题描述

我们的应用程序使用 node.js Core &Angular 7.2 版

Our app uses the node.js Core & Angular version 7.2

我们经常推出 Angular 应用的生产版本，以便在一个月内部署 3-4 次更改.

We are frequently rollout production build of the Angular app to deploy the changes 3-4 times in a month.

我收到了一些客户的投诉，他们无法看到更改，除非他们清除缓存或在浏览器中硬重新加载页面.

I have received some client's complaints who are unable to see changes unless they clear their cache or hard reload the page in the browser.

我认为 ng build --prod 创建了唯一的哈希值，因此它可以处理缓存破坏，但它似乎并没有发生.

I thought ng build --prod created unique hashes so it would handle cache-busting, But it doesn't seem to be happening.

在 angular.json 中，我有以下用于生产构建的配置

In angular.json I have below configuration for the production build

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

在运行 ng build --prod 后，它会生成散列文件，它与以前的版本不同，基于更改.此外，我已将服务器配置为不缓存 index.html.那么为什么有时用户需要硬重新加载页面或手动清除缓存以获取最新更改?

After running ng build --prod it is generating hashed files and it's different from previous version based on changes. Also, I have configured the server to do not cache index.html. then why sometimes users need to hard reload the page or clear the cache manually to get the latest changes?

除了告诉客户端清除缓存之外，我还有什么方法可以解决这个问题?

Is there any way I can combat this issue besides telling clients to clear their cache?

任何建议将不胜感激.

推荐答案

angular 旧版本:

angular old version:

ng build --prod --aot --output-hashing=all

对于较新版本的 angular(例如 Angular 10)，命令现已更新:

For the newer version of angular ( for example Angular 10) the command is now updated:

ng build --prod --aot --outputHashing=all

这篇关于在 Angular 7 中进行生产构建后，缓存破坏有时不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！