Flask: Favicon does not refresh in static folder

Question

I saved a test favicon for my Flask webapp with Jinja2 in the static folder as favicon.ico. Then I added to the HTML file:

<link rel="shortcut icon" href="{{ url_for('static', filename='favico.ico') }}">

I then deleted the favicon.ico file out of the static folder and added a new favicon and named it the same thing, favicon.ico. It then automatically updates to the previous favicon image I just deleted. It renders the correct favicon when I change the file name to something else though, like favico.ico.

Is this folder caching the previous favicon file by name? How do I clear it if so? I'm running Windows 10 Home.

Answer 1

This might have to do with the browser you are using as some browser do cache static files for fast web loading. Mostly it happens with chrome. Try testing your website on firefox.

Answer 2

It can be due to two reason either your flask or your browser is saving it in cache.

Add this to your application.py:

app.config["CACHE_TYPE"] = "null"  
cache.init_app(app)

OR

Try cleaning your browser cache and cookie.

If still doesn't works try checking if you are using the right name as in question you are saying favicon.ico but writing favico.ico in link.

Answer 3

As @Ankur's answered , most of modern browser would like to cache static files for fask web loading .

So you can add query string includes FileInfo of static file.

My solution is rewrite the flask.url_for in app.context_processor, which will add a timestamp for static files.

eg: /static/index.js ==> /static/index.js?ts=${MODIFIED_TIME}

Here is my code:

```python

import os 
from flask import Flask

app = Flask(__name__)

@app.context_processor
def override_url_for():
    return dict(url_for=dated_url_for)


def dated_url_for(endpoint, **values):
    if endpoint == 'static':
        filename = values.get('filename', None)
        if filename is not None:
            path = os.path.join(app.root_path, endpoint, filename)
            values['ts'] = int(os.stat(path).st_mtime)
    return url_for(endpoint, **values)

```

Also, you can use md5sum of file instead of timestamp, just customize as you like.

:)

Answer 4

When I tried using this method for the favicon display, <link rel="shortcut icon" href="{{ url_for('static', filename='favico.ico') }}"> It didn't work, I tried some other methods like clearing the cache, the issue still persists. so I tried using the regular method which is <link href="../static/favicon_io/favicon.ico" rel="icon"> and it worked.

I then later tried using it this way <link rel="shortcut icon" href="{{ url_for('static', filename='favicon_io/favico.ico') }}"> where favicon_io is a folder inside the static folder, and it worked.