Base solution for your next web application
Open Closed

cache busting - angular #6840


User avatar
0
BobIngham created

angular, dotnetcore, 6.8.0, .net 4.6.1 Hi all,

I recently had a problem with browser cache after i released an upgrade from 5.4.1 to 6.8.0. Fortunately we are still in pre-lauch and I only have four tenants and about a hundred users to support. But having to answer support calls with "press Ctrl-F5 simultaneously" became a little wearisome. I know the hashing mechanism of angular should remove most problems but I believe items in the assets folder still caused problems.

Can anyone see any reason for me NOT to add the following lines to the head of index.html?

<meta http-equiv="cache-control" content="no-cache, must-revalidate, post-check=0, pre-check=0">
<meta http-equiv="expires" content="0">
<meta http-equiv="pragma" content="no-cache">

Can anyone tell me if it's a pointless exercise?


7 Answer(s)
  • User Avatar
    0
    commondesk created

    Did it work?

  • User Avatar
    0
    commondesk created

    I came across this article a while ago.

    https://blog.nodeswat.com/automagic-reload-for-clients-after-deploy-with-angular-4-8440c9fdd96c

    A trick often used, is to have your files timestamped each time you change them. This will force browsers to invalidate the cache and re-download the files, and thus all the people who come to the site after deploy will get the new version of your files. There will always be users who have left the page open and will be using the old version for a short time, but usually this isn’t a big problem, especially when dealing with sites where users spend 2–10 minutes.

    I've not attempted to implement it, but it looks to be the correct approach.

  • User Avatar
    0
    BobIngham created

    My last release to production was problematical, to say the least. I am currently building development and staging slots. Once I'm happy I will gadly post back the results.

  • User Avatar
    0
    ismcagdas created
    Support Team

    @bobingham

    As you mention, Angular's hashing mechanism solves many of the problems. We just load some theme specific css/js files manually, maybe they can cause such problems. Adding a timestemp to their url in DynamicResourcesHelper.ts might help.

  • User Avatar
    0
    BobIngham created

    Hi @ismcagdas, thanks for that but it's exactly the kind of file I don't want to touch - that level of expertise os for you guys. All I need to know are your comments on adding the following lines to index.html:

    <meta http-equiv="cache-control" content="no-cache, must-revalidate, post-check=0, pre-check=0">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="pragma" content="no-cache">
    
  • User Avatar
    0
    ismcagdas created
    Support Team

    @bobingham

    I'm making web development for a long time and I never see those attributes work properly in the past :).

  • User Avatar
    0
    BobIngham created

    @ismcagdas, thanks for getting back. On your advice I will stick with the standard index.html file.