Search code examples
javascripthtmlcachingstorage

How do I control web page caching, across all browsers?


I have a website up and running; I am constantly working on improving the site. But unless the costumer presse clears the cache it does not update to the latest version of my css and html. I wanted to change the http cache header to be

USING HTML

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">

So this way the website has all the current info at all time.

But I have no idea as to where to put this code in. Do I create a new file named html or do I just input this somewhere in my index.html. Please help.


Solution

  • You can put meta tag inside the head tag of your html file but if header is present in http response than that takes priority over meta tag. If you are using apache then create .htaccess file and set header there to prevent caching

    <IfModule mod_headers.c>
        Header set Cache-Control "no-cache, no-store, must-revalidate"
        Header set Pragma "no-cache"
        Header set Expires 0
    </IfModule>