title: How to pass uploaded image to template.html in Flask
body: <p>I am using <a href="http://flask.pocoo.org/" rel="noreferrer">flask</a>, and trying to do something very simple using the quickstart tutorial, just running on my machine (local server). I produce a simple upload form which successfully uploads an image file. I then want to pass this image as a variable to a <code>template.html</code> for display within a page. The <code>template.html</code> file displays fine, but the image is always a <code>broken link image symbol</code>. I've tried a number of different paths, but I have a feeling I am doing things a bit wrong. </p>
  
  <pre><code>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 '''
      &lt;!doctype html&gt;
      &lt;title&gt;Upload new File&lt;/title&gt;
      &lt;h1&gt;Upload new File&lt;/h1&gt;
      &lt;form action="" method=post enctype=multipart/form-data&gt;
        &lt;p&gt;&lt;input type=file name=file&gt;
           &lt;input type=submit value=Upload&gt;
      &lt;/form&gt;
      '''
  
  @app.route('/uploads/&lt;filename&gt;')
  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()
  </code></pre>
  
  <p>This is <code>template.html</code>:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;title&gt;Hello from Flask&lt;/title&gt;
  {% if filename %}
    &lt;h1&gt;some text&lt;img src="{{filename}}"&gt; more text!&lt;/h1&gt;
  {% else %}
    &lt;h1&gt;no image for whatever reason&lt;/h1&gt;
  {% endif %}
  </code></pre>
  
  <p>How can I pass the uploaded image file to <code>template.html</code> so it will display correctly?</p>
  
  <p>Thanks</p>