CODEWITHSUNDEEP
javascripthtmlbrowser-cache
user3533397
user3533397

Reputation: 191

Avoid browser caching on client side

We have a website (pure html/js/css). In our site pages, we have links to PDF files, these links looks like this: <a href="../files/myFile.pdf">My file link</a>. So, the problem: sometimes we need to update our PDFs. We update these files, then go to the website, press the link - and we see old file. Ctrl+F5, or F5 in Firefox - and we see updated file. It is not good. I think that this problem caused by caching.
In our site pages (html pages, which contain links), we added such tags:

    <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">

But it does not help. How can we avoid client-side caching? I read some questions here. This solution had been taken from stackoverflow) Also I know about adding random parameter into page URL, but some guys say that it is bad way.
Please, help with this problem. Can we avoid client-side caching only with JS? Maybe it is possible with .htaccess file on server side, but we have no access there.

Upvotes: 2

Views: 3080

Answers (1)

Krzysztof Raciniewski
Krzysztof Raciniewski

Reputation: 4924

You can disable caching in the Nginx or Apache web server:

    location /pdf_file_location {
        root /your/site/public;
        index index.html;

        # kill cache
        add_header Last-Modified $date_gmt;
        add_header Cache-Control 'no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0';
        if_modified_since off;
        expires off;
        etag off;
    }

More informations about this you can read here

Or in the simplest way, add a variable parameter to the URL(you can generate sequence, timestamp, fixed version of the file or any other random value):

<a href="../files/myFile.pdf?v=1580807492744">My file link</a>

?v=1580807492744 - if the value changes, the cache will not work

Upvotes: 1

Related Questions