angular - 这对于在构建 Angular 应用程序时通过当前时间戳或哈希码缓存静态文件很有用

Question

我对静态文件的缓存破坏感到困惑。这可能是常见的话题，但让我们在下面有一个场景。

我正在开发一个 Angular 应用程序，并且有一些在引导时请求（使用 httpClient）的静态 json 文件。这些静态文件的路径在 enviroment.ts 文件中给出，如下所示

export const enviroment ={
appConfig: 'asset/appConfig.json'
}

然后在应用初始化文件 (app.Initializer.ts) 中重新驱动它

public resolveConfigurations(){
httpClient.get(enviroment.appConfig).then((data) => {
 // confid data loaded
})
}

然后我使用 resolveConfigurations 方法作为 Angular 的 APP_INITIALIZER

@NgModule({

providers: [
{
provide: APP_INITIALIZER,
useFactory:resolveConfigurations ,
multi: strue
}]
})

我知道在构建应用程序时，Angular 会为生成的包添加一个哈希，并将其嵌入到根 index.html 文件中。但是如果我对这些静态文件进行更改，最终用户将需要在新部署后清除缓存。

在这里，我怀疑为缓存破坏添加当前时间戳如下所示可以解决问题，这似乎是一个快速修复，但它总是会在用户刷新浏览器窗口时从服务器加载文件。

public resolveConfigurations(){
const versionId = new Date().getTime().toString();
httpClient.get(enviroment.appConfig + '/version=' + versionId).then((data) => {
 // confid data loaded
})
}

或者我应该以某种方式生成一个 bustId 作为构建过程的一部分并使用它，这似乎更正确，因为它只会在构建应用程序时创建 bustId，然后在新部署后加载一次静态文件。

假设，我设法用 npm run build 生成了 bustId 并且可以如下使用它

public resolveConfigurations(){
httpClient.get(enviroment.appConfig + '/version=' + bustId).then((data) => {
 // confid data loaded
})
}

或者，是否只需说每次都加载它（时间戳为 bustId），因为它不需要太多时间（静态文件需要几毫秒才能加载）？

任何建议。

我的应用程序部署在 NGINX 服务器上

PS请注意任何不正确的语法

谢谢

标签： angularcaching