Resizing images using a for loop

[bilal-karim]

I’m trying to resize images all of the images inside a directory using a for loop, but having some troubles.

{% for image in images %}
    <img src="{{ url_for('static', filename='img/photos/' + image|resize('600x400', quality=100)) }}">
{% endfor %}

Results in the following error:

flask_resize.exc.UnsupportedImageFormatError
UnsupportedImageFormatError: JPEG and PNG are the only supported output file formats at the moment.

All images inside the directory are JPEGs, and they have ".jpg" as their extension so I’m not sure why I’m getting that error. Flask-Resize itself is working fine, as I tested it on one single image by hardcoding the path to the file. But I need all of the images on this page to resize.

I also tried this inside my for loop:

{% set myURL = 'img/photos/' + image %}
<img class="slb" src="{{ myURL|resize('600x400', quality=100) }}">

This is my code on the back-end:

@app.route("/photos")
def photos():
    images = os.listdir(os.path.join(app.static_folder, 'img/photos'))
    return render_template("photos.html", images=images)