Python Flask force reload cached JS files

Question

I am using following code to cache my static files on my flask app which is hosted on heroku:

# cache control
@app.after_request
def add_header(response):
    # rule so it will only affect static files
    rule = request.path
    if "static" in rule:
        response.cache_control.max_age = 1000000
        return response
    else:
        return response

It works fine.

But now I made some changes and I need that the site loads the new files. If I open the site in regular browser where I already opened it, it loads the old files (because they are cached).

In incognito mode or hitting ctrl+f5 = loads the new files. The problem is a regular user wont hit ctrl+f5 or use incognito mode.

The common approach is to add a pseudo param to the resource you're loading (e.g. a timestamp or version). Related SO question: http://stackoverflow.com/questions/11467873/ That's also the method SO uses to ensure you're loading the latest JS/CSS file (just look at the source of this very page). — Mike Scotty, May 12 '17 at 10:00

score 9 · Accepted Answer · answered May 12 '17 at 11:46

As @mpf82 proposed you can simply add a version or something as a query string argument to the file which you want to reload.

If the filename changes the browser wont cache the old file anymore.

In flask variables which are unknown in an url_for are handled as query strings, so you simply choose a variable which is unknown, f.e. versionand add there a version number, f.e. 12052017:

<script type=text/javascript src="{{ url_for('static', filename='js/main.js', version='12052017') }}"></script>

And thats it, the result:

<script type=text/javascript src="/static/js/main.js?version=12052017"></script>

This is awesome, and so simple! You can also pass a variable whose value is datetime.date.today() if you want it to refresh at least daily, but maybe that's not super efficient. — Sean McCarthy, Jun 28 '20 at 16:15

Python Flask force reload cached JS files

1 Answers1