Как передать загруженное изображение в template.html в Flask
Я использую flask и пытаюсь сделать что-то очень простое с помощью учебника быстрого запуска, просто работающего на моем компьютере (локальном сервере), Я создаю простую форму загрузки, которая успешно загружает файл изображения. Затем я хочу передать это изображение как переменную в template.html для отображения на странице. Файл template.html отображается нормально, но изображение всегда равно broken link image symbol. Я пробовал несколько разных путей, но у меня есть чувство, что я делаю что-то неправильно.
import os
from flask import Flask, request, redirect, url_for, send_from_directory,
render_template
UPLOAD_FOLDER = '/home/me/Desktop/projects/flask/uploads'
ALLOWED_EXTENSIONS = set(['txt', 'pdf', 'png', 'jpg', 'jpeg', 'gif'])
app = Flask(__name__)
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
def allowed_file(filename):
return '.' in filename and \
filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS
@app.route('/', methods=['GET', 'POST'])
def upload_file():
if request.method == 'POST':
file = request.files['file']
if file and allowed_file(file.filename):
filename = secure_filename(file.filename)
file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
return redirect(url_for('uploaded_file', filename=filename))
return '''
<!doctype html>
<title>Upload new File</title>
<h1>Upload new File</h1>
<form action="" method=post enctype=multipart/form-data>
<p><input type=file name=file>
<input type=submit value=Upload>
</form>
'''
@app.route('/uploads/<filename>')
def uploaded_file(filename):
filename = 'http://127.0.0.1:5000/uploads/' + filename
return render_template('template.html', filename = filename)
if __name__ == '__main__':
app.run()
Это template.html:
<!doctype html>
<title>Hello from Flask</title>
{% if filename %}
<h1>some text<img src="{{filename}}"> more text!</h1>
{% else %}
<h1>no image for whatever reason</h1>
{% endif %}
Как передать файл загруженного изображения в template.html, чтобы он отображался правильно?
Спасибо
Ответы
Ответ 1
Теперь происходит то, что /uploads/foo.jpg возвращает HTML внутри template.html. Там вы пытаетесь использовать /uploads/foo.jpg как источник тега img. Нигде вы не показываете фактическое изображение.
Позвольте изменить его следующим образом: /show/foo.jpg возвращает HTML-страницу, а /uploads/foo.jpg возвращает изображение. Замените последний маршрут этими двумя, и вам должно быть хорошо идти:
@app.route('/show/<filename>')
def uploaded_file(filename):
filename = 'http://127.0.0.1:5000/uploads/' + filename
return render_template('template.html', filename=filename)
@app.route('/uploads/<filename>')
def send_file(filename):
return send_from_directory(UPLOAD_FOLDER, filename)
Ответ 2
Из функции uploaded_file мы отправимся в template.html и вернемся назад <img src="{{ url_for('send_file', filename=filename) }}">, вернемся назад, мы нажмем на функцию send_file, которая покажет содержимое HTML внутри шаблона с загруженным и сохраненным в UPLOAD_FOLDER образом указано. вам также не хватает from werkzeug import secure_filename этого в файле py
@app.route('/show/<filename>')
def uploaded_file(filename):
return render_template('template.html', filename=filename)
@app.route('/uploads/<filename>')
def send_file(filename):
return send_from_directory(UPLOAD_FOLDER, filename)
Теперь ваш шаблон .html будет выглядеть следующим образом.
<!doctype html>
<title>Hello from Flask</title>
{% if filename %}
<h1>some text <img src="{{ url_for('send_file', filename=filename) }}">more text!</h1>
{% else %}
<h1>no image for whatever reason</h1>
{% endif %}
Ответ 3
Я пытаюсь сделать что-то подобное, но в слайд-шоу начальной загрузки, которое может работать для меня?
