2

Ive read about this method called cache-busting that allows us to add version parameters to our js and css files so that clients wont have to clear cache every time we have an update. However, I didn`t read any about html.

Is there any method that allows us to load latest html file changes without clearing the cache?

P.S. I dont know about others but I just discovered that it is angularjs that is caching my templates. I posted my own solution anyway

JkAlombro
  • 1,696
  • 1
  • 16
  • 30

2 Answers2

6

Solved it. Just append a parameter string to your routes that are referencing your html files just like what we did on cache-busting for css and js.

.when('/login', {
        templateUrl: "../views/login.html?v=" + versionNumber,
        controller: "LoginController"
    })

Where 'versionNumber' is a global variable.

JkAlombro
  • 1,696
  • 1
  • 16
  • 30
  • 1
    I recommend setting a second variable such as _versionUrl = "?v=" + versionNumber_ so that you don't have to put "?v=" at the end of every templateUrl in your app. – wentz Dec 18 '19 at 18:52
1

EDIT

The link in the original answer is broken.

Aside from the accepted answer, the answers on this question offer interesting alternatives depending upon your build process.

ORIGINAL

You should be able to force reload the browser via js, while applying a hash to the url, via page-specific javascript that exists only on an updated version of the html file.

This would allow you to know when you are receiving the latest version of the file.

https://developer.zendesk.com/blog/static-file-cache-busting

Judd Franklin
  • 570
  • 2
  • 5
  • 16