I have a python script that creates a flask webserver, its code is the following:
from flask import Flask
from time import strftime, sleep, localtime
from flask import render_template
import os
app = Flask(__name__)
@app.route("/")
def hello():
return render_template('home.html')
@app.route("/gallery")
def fill_gallery():
image_names = os.listdir('./images')
print('image_names: ',image_names)
return render_template('gallery.html', image_names=image_names)
if __name__ == "__main__":
app.run(host='0.0.0.0', debug=True)
I want to upload pictures to a website on my raspberry pi, but the pictures are not displayed correctly.
my gallery.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">Gallery</h1>
</div>
{{image_names}}
<hr>
{% for image_name in image_names %}
<div>
<img class="img-responsive" src=" {{url_for('fill_gallery', filename=image_name)}}">
</div>
{% endfor %}
</div>
</div>
</body>
</html>
I have 4 images in my images folder which names are displayes on the page. But I can only see that little broken picture icon, not the picture themselves. What can be the problem?
Thanks