Python/Flask - 从文件输入显示图像答案

【问题标题】：Python/Flask - Display image from file inputPython/Flask - 从文件输入显示图像
【发布时间】：2021-07-02 15:16:03
【问题描述】：

简单明了，我的目标是让用户输入他们的姓名，然后从文件输入中选择一个图像。在我上一个问题的帮助下，我能够将名称转移到下一页，但无法显示选定的图像。

现在，填写时会提供名称和图像文件名。希望得到图片文件来实际显示图片。

主页...

显示页面...

这是我当前的代码：

主页.html

{% extends 'base.html' %}
{% block head %}
<title>Home Page</title>
{% endblock %}
{% block body %}

  <div class="content-container">
    <form action="{{ url_for('result') }}" method="post">
      <h2>Input your name:</h2>
      <input type="text" class="user-input user mb-3" name="user">
      <h2>Select your image:</h2>
      <input type="file" accept="image/*" class="form-control-file"
             id="formControlFile1" name="image">
      <input class="btn btn-outline-primary" type="submit" value="Submit">
    </form>
  </div>

{% endblock %}

结果.html

{% extends 'base.html' %}
{% block head %}
<title>Result Page</title>
{% endblock %}
{% block body %}

  <div class="content-container">
    <h2>{{ name }}</h2>
    <h2>{{ image }}</h2>
  </div>

{% endblock %}

main.py

from flask import Flask, render_template, request, url_for, redirect

app = Flask(__name__)


@app.route('/', methods=['GET', 'POST'])
def home():
    if request.method == 'POST':
        user = request.form["user"]
        image = request.form["image"]
        return redirect(url_for('result', name=user, image=image))
    return render_template('home.html')


@app.route("/result", methods=['GET', 'POST'])
def result():
    name = request.form.get('user')
    image = request.form.get('image')
    return render_template("result.html", name=name, image=image)


if __name__ == "__main__":
    app.run()

所以，是的，希望我解释得足够简单。用户输入名称，选择图像，目标是在结果页面上显示名称和显示图像。感谢任何可以为这个卑微的灵魂提供指导的人。

【问题讨论】：

图像不能这样工作。您需要对其进行 base64 编码并将图像发送或保存到服务器静态位置并通过发送
@Epsi95，或者将图像保存在某个私人文件夹中并通过某种路径进行代理。
我不太确定proxify 的含义，但是您可以保存图像并将base64 编码版本作为<img src="data:image/png;base64, {base64 string}" alt="" /> 发送或发送，也可以使用@ 访问烧瓶应用程序中的图像987654330@不是request.form

标签： python html flask

【解决方案1】：

你可以试试这样的

表单的enctype 应该是multipart/form-data

{% extends 'base.html' %}
{% block head %}
<title>Home Page</title>
{% endblock %}
{% block body %}

  <div class="content-container">
    <form action="{{ url_for('result') }}" method="post" enctype="multipart/form-data">
      <h2>Input your name:</h2>
      <input type="text" class="user-input user mb-3" name="user">
      <h2>Select your image:</h2>
      <input type="file" accept="image/*" class="form-control-file"
             id="formControlFile1" name="image">
      <input class="btn btn-outline-primary" type="submit" value="Submit">
    </form>
  </div>

{% endblock %}

您需要使用request.files 并在base64 中解码

import base64
from flask import Flask, render_template, request, url_for, redirect

app = Flask(__name__)


@app.route('/', methods=['GET', 'POST'])
def home():
    if request.method == 'POST':
        user = request.form["user"]
        image = request.files['image']  # get file
        image_b64 = base64.b64encode(image.read()).decode('utf-8')
        return redirect(url_for('result', name=user, image_b64=image_b64))
    return render_template('home.html')


@app.route("/result", methods=['GET', 'POST'])
def result():
    name = request.form.get('user')
    image_b64 = request.form.get('image_b64')
    return render_template("result.html", name=name, image_b64=image_b64)


if __name__ == "__main__":
    app.run()

您应该更改您的 HTML 以从 base64 转换图像

{% extends 'base.html' %}
{% block head %}
<title>Result Page</title>
{% endblock %}
{% block body %}

  <div class="content-container">
    <h2>{{ name }}</h2>
    <img src="data:image/png;base64, {{ image_b64 }}">
  </div>

{% endblock %}

【讨论】：