Angular如何防止缓存?
创始人
2024-10-29 07:00:31
0

在Angular应用程序中,可以使用以下方法防止浏览器缓存文件:

  1. 给应用之后的所有文件添加版本号(如?v=1.0.0),以便每次更改后都能强制客户端从服务器重新下载文件。可以在Angular的构建配置文件(angular.json, .angular-cli.json等)中配置输出文件名带上版本号:
"outputHashing": "all"

或者手动使用以下语法添加版本号:


  1. 让Angular服务端生成的HTML具有唯一性,以便客户端从服务器获得新页面的HTML而不是缓存的HTML。可以在app.module.ts文件中,通过指定providers为APP_INITIALIZER,以便在应用程序启动时执行:
import { NgModule, APP_INITIALIZER } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';

export function initApp() {
  // 用随机数作为版本号
  const version = Math.random();
  document.cookie = `appVersion=${version}`;
}

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule],
  providers: [
    {
      provide: APP_INITIALIZER,
      useFactory: initApp,
      multi: true
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

这将在应用程序房启动时随机生成一个版本号,并以cookie的方式存储。每当重新启动应用程序时,都会生成新的版本号。

注:这种方法基于一个假设:如果HTML是唯一的,那么它的资源也应该是唯一的。

  1. 配置服务器(如Nginx)为禁用浏览器缓存,以便客户端从服务器获取更新的文件。可以将下面的代码放入服务器的配置文件中:
location / {
  //

相关内容

热门资讯

7分钟科普!山西扣点点挂神器,... 7分钟科普!山西扣点点挂神器,天天贵阳麻将的机制,黑科技教程(揭秘有挂)1、在天天贵阳麻将ai机器人...
分辨真假!德州游戏辅助器(we... 分辨真假!德州游戏辅助器(wepoke软件)外挂透明挂辅助器(透视)必胜教程(2022已更新)(哔哩...
终于清楚!wpk数据手机软件叫... 您好,wpk数据这款游戏可以开挂的,确实是有挂的,需要了解加微【439369440】很多玩家在这款游...
总算了解(大厅wpk)外挂透明... 总算了解(大厅wpk)外挂透明挂辅助APP(辅助挂)透视辅助(2021已更新)(哔哩哔哩)是一款可以...
八分钟科普!云龙逮杠麻将有挂,... 八分钟科普!云龙逮杠麻将有挂,雀神广东麻将设置方法,可靠技巧(有挂教程)是一款可以让一直输的玩家,快...
必看攻略!wepoke有规律(... 必看攻略!wepoke有规律(wePOKE)外挂透视辅助器(辅助挂)透牌教程(2021已更新)(哔哩...
重大通报!wpk俱乐部盈利模式... 重大通报!wpk俱乐部盈利模式(透视)原来确实真的有挂2025已更新)(哔哩哔哩)1)wpk俱乐部辅...
实测分享(智星德州扑克)外挂辅... 实测分享(智星德州扑克)外挂辅助插件(辅助挂)德州论坛(2022已更新)(哔哩哔哩);原来确实真的有...
8分钟科普!广西山水麻将辅牌器... 8分钟科普!广西山水麻将辅牌器,广东雀神麻雀辅助器在哪里下载,2024新版总结(有挂方法)1、完成广...
记者揭秘!德州app辅助工具(... wpk安卓版本新手教程相关信息汇总(需添加指定薇757446909获取下载链接);记者揭秘!德州ap...