Cómo pasar la imagen cargada a template.html en Flask

Estoy usando flask, y trato de hacer algo muy simple usando el tutorial de inicio rápido, simplemente ejecutándolo en mi máquina (servidor local). Produzco un formulario de carga simple que carga con éxito un archivo de imagen. Luego quiero pasar esta imagen como una variable a template.html para mostrar dentro de una página. El archivo template.html se muestra bien, pero la imagen es siempre broken link image symbol. He intentado una serie de caminos diferentes, pero tengo la sensación de que estoy haciendo las cosas un poco mal.Cómo pasar la imagen cargada a template.html en Flask

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()

Ésta es 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 %}

¿Cómo puedo pasar el archivo de imagen cargado en template.html por lo que se mostrará correctamente?

Gracias

Fuente

2012-06-29 fraxel

lo que está sucediendo ahora es que /uploads/foo.jpg devuelve el HTML dentro template.html. Ahí intenta usar /uploads/foo.jpg como fuente de la etiqueta img. En ninguna parte sirves la imagen real.

Modifíquelo de esta manera: /show/foo.jpg devuelve la página HTML y /uploads/foo.jpg devuelve la imagen. Vuelva a colocar la última ruta con estos dos y usted debe ser bueno para ir:

@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)

Fuente

2012-06-29 13:32:45 Miikka

Quizás esta es una pregunta tonta, pero cuando se send_file cada terminar encima de conseguir con esta llamada ¿adición? – Uzebeckatrente

@Uzebeckatrente, la etiqueta '' en la plantilla apunta a '/ uploads/', que se enruta a send_file. – Miikka

Hola @Mikika Estoy intentando esto en el servidor de la nube. La misma lógica no funciona para mí. Muestra la ruta de la imagen completa dentro de la etiqueta src. ¿Puedes sugerir algo? –

De la función uploaded_file, nos dirigimos a la template.html y habrá son redirigidos hacia atrás <img src="{{ url_for('send_file', filename=filename) }}"> volver llegamos a la función que será send_file muestre el contenido del HTML dentro de la plantilla con la imagen cargada y almacenada en el UPLOAD_FOLDER especificado. También se echa en falta en este from werkzeug import secure_filename archivo 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)

Ahora su template.html se verá así ..

<!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 %}

Fuente

2013-10-02 22:29:07 Transformer

Cómo pasar la imagen cargada a template.html en Flask

Respuesta

Cuestiones relacionadas