Force the browser to update translations files after deployment-CodePudding

We have an app built on Angular/Ionic. For the translations, we use ngx-translate/core package. Everything is deployed on Firebase hosting.

When we do a new build and deployment, Angular automatically generates a hash for js file names, and if it's changed, the browser understands that it needs to pull the latest version.

How we can do the same behavior for the .json file with translations? The issue is that users do not receive the latest version of the translations after deployment

CodePudding user response：

In your app.module.ts change your Module declaration to:

TranslateModule.forRoot({
          loader: {
            provide: TranslateLoader,
            useFactory: (http: HttpClient) =>
              new TranslateHttpLoader(http, './assets/i18n/', `.json?v=${new Date().getTime()}`),
            deps: [HttpClient],
          },
        }),

That way each request sends a different request with a not needed queryParam, which will refetch the newest translation files.