Usar estáticos en aplicación Flask

Si estás trabajando con Flask ya sabes que lo primero que hay que hacer para usar estáticos en aplicación Flask es guardarlos en la carpeta /static. De esta manera cuando estemos creando plantillas sabremos dónde se encuentran estos ficheros: imágenes, librerías javascript, hojas de estilo,…

De primeras podríamos referenciar a un estático desde un template de la siguiente forma:

<img src="/static/images/logo.png">

Y este código no tiene porque fallar cuando ejecutemos nuestra aplicación Flask. Si bien, es verdad, que la forma en la que configuren y desplieguen la aplicación puede no estar bajo nuestro control. Así que puede variar la URL en la que se ejecute la aplicación o renombren el directorio de los estáticos.

Utilizar url_for para referenciar estáticos

Así que deberemos de utilizar el método url_for para obtener la URL de la forma más correcta.

url_for('static', filename='images/logo.png')

De esta forma si tenemos el siguiente recurso: /static/images/logo.png

Podemos referenciarlo de la siguiente manera:

url_for('static', filename='images/logo.png')

Y usarlo dentro de nuestro template de una forma sencilla:

<img src=" url_for('static', filename='images/logo.png') ">

Con esto ya hemos visto lo sencillo que es usar estáticos en aplicación Flask.