I am attempting to build a "version updated" ponent that will show a banner when the website has been updated and prompt a user to reload. Unfortunately when some users reload their page is cached so it does not update properly. Previously we have told them to press CTRL+F5 but I am looking for a way to do this programatically.
I am using the following code
this.$window.location.reload(true);
Whose function signature is declared like so:
reload(forcedReload?: boolean): void;
Does this mean that it will skip the cache? When I try it out a CTRL+F5 the index.html shows a 200 in the Network tab of Chrome but using $window.location.reload(true)
shows a 304 [Not Modified]
I am attempting to build a "version updated" ponent that will show a banner when the website has been updated and prompt a user to reload. Unfortunately when some users reload their page is cached so it does not update properly. Previously we have told them to press CTRL+F5 but I am looking for a way to do this programatically.
I am using the following code
this.$window.location.reload(true);
Whose function signature is declared like so:
reload(forcedReload?: boolean): void;
Does this mean that it will skip the cache? When I try it out a CTRL+F5 the index.html shows a 200 in the Network tab of Chrome but using $window.location.reload(true)
shows a 304 [Not Modified]
- 1 According to MDN, it seems so. But there might be some differences in the ctrl + F5 process other than ignoring the cache. – Nisarg Shah Commented Aug 11, 2017 at 8:07
-
If you version your resource and script files during your build process, you can still use
$window.location.reload()
to get the latest version always. – Gaara Commented Aug 11, 2017 at 8:33 - @Gaara Thank you, I version all my resources so it sounds like this would work – Chris Commented Aug 11, 2017 at 8:34
- Manage chache settings on your server - F5 should be enough. – Petr Averyanov Commented Aug 11, 2017 at 9:50
- @NisargShah Please write your ment as an answer so I can accept it. After testing more this works as per the documentation, thank you – Chris Commented Aug 11, 2017 at 9:52
3 Answers
Reset to default 3No it's not (proven by testing)
The main difference: Ctrl-F5
will cause all the attached resources also to reload (scripts, images ...) while the reload(true)
will not, the main page (html) will be requested but resources can still be loaded from cache
According to MDN the forcedReload
parameter in window.location.reload
, when set to true
:
... causes the page to always be reloaded from the server. If it is false or not specified, the browser may reload the page from its cache.
Did you try something like:
$window.location.href = currentUrl + '?' + new Date().getTime();
That should force a cold refresh.