Question

我经常更新的Angular应用程序有问题。

我想避免浏览器缓存，我正在尝试几种替代方法，但是它们都不起作用。

第一件事是，我很难测试该解决方案是否有效，因为当我上载新版本时，有时我看到它而不必执行其他操作，而不必刷新页面，而有时候我需要打开控制台并强制刷新清空缓存。

我试图在请求标头中包括Cache-Control：no-cache，如您在图像中所见，但这对我不起作用。

我也尝试过，放入app.component.ts

templateUrl: './app.component.html? v1'

正如我在some answers中所见，但都没有。

事实是我很绝望，因为当我给出我认为可行的东西时，当我与老板核对时，他不会刷新它:-(，而且坏的是，正如我所说的，我不知道如何真正检查一下，每次我进入网络时，服务器都会要求提供最新版本。

谢谢您的帮助

Answer 1

我也每天更新我的应用程序，我用它来通知用户应用程序已过时并请求刷新页面。

constructor(
    private swUpdate: SwUpdate,){

    public checkForUpdates(): void {
    this.updateSubscription = this.swUpdate.available.subscribe(event => this.promptUser());

    if (this.swUpdate.isEnabled) {
      // Required to enable updates on Windows and ios.
      this.swUpdate.activateUpdate();
      interval(300000).subscribe(() => {
        this.swUpdate.checkForUpdate().then(() => {
         console.log('checked for updates');
        });
      });
    }}

    // Important: on Safari (ios) Heroku doesn't auto redirect links to their-
    //https which allows the installation of the pwa like usual
    // but it deactivates the swUpdate. So make sure to open your pwa on safari
    //like so: https://example.com then (install/add to home)
    
      }

      promptUser(): void {
        this.swUpdate.activateUpdate().then(() => {
          const snack = this.snackbar.open('A New Update Is Available Click To 
          Reload', 'Reload');
          snack
            .onAction()
            .subscribe(() => {
              window.location.reload();
            })

  
 

       });
      }

Answer 2

使用ng build构建应用程序时，应使用以下标志：

--outputHashing=all

这是为了启用缓存清除。这样会将哈希添加到每个生成的文件中，这样，每当您将新版本上传到服务器时，浏览器都将被迫加载最新版本。

因此，一种方法是运行以下代码：

ng build --prod --outputHashing=all

您可能会在here上阅读有关构建选项标志的更多信息。

如果您不希望在运行ng build时附加标志，则应在您的配置文件中的angular.json文件中进行设置。

"configurations": {
  "production": {
    "optimization": true,
    "outputHashing": "all",
     .
     .
     .
  }
}

Answer 3

尝试location.reload(true);

根据w3c description：

默认情况下，reload（）方法从高速缓存中重新加载页面，但是您可以通过将forceGet参数设置为true来强制它从服务器重新加载页面：location.reload（true）。

Answer 4

您可以使用以下命令强制重新加载页面：

window.location.replace('/path');

Answer 5

尝试单击检查，然后在刷新图标上单击鼠标右键，您将看到选项为空的缓存并对其进行硬重载

清除Angular中的浏览器缓存

5 个答案: