如何使用 flask 应用程序的文本和图像设置 html？

Question

我有一个 flask 应用程序，它看起来像：

@app.route("/predict", methods=["GET","POST"])
def predict():    
    if request.method == "POST":        
        if request.files:
            raw_data = request.files['image'].read()         
            finalNumpyArray=np.array(json.loads(raw_data), dtype = 'uint8')
            processed_image = preprocess_image(finalNumpyArray)
            processed_image1 = preprocess_image1(finalNumpyArray)    
            prediction = model.predict(processed_image).tolist()
            f1 = plt.imshow(processed_image1, interpolation='none')
            f1.show()

            response = {
                'prediction': {
                    'Center': prediction[0][0],
                    'Donut': prediction[0][1],
                    'Edge-Loc': prediction[0][2],
                    'Edge-Ring': prediction[0][3],
                    'Loc': prediction[0][4],
                    'Random': prediction[0][5],
                    'Scratch': prediction[0][6],
                    'None': prediction[0][7],
                }
            }


            return jsonify(response)
    return render_template("predict.html")

第一个预测页面显示“predict.html”页面，您可以在其中上传图像以获取由我在应用程序中加载的 model 预测的图像。 上传后，第二个页面出现，带有 jsonify(response)。

我想将 jsonify(response) 更改为 html，它对“response”变量具有很好的读数，并且还显示了 f1 图 plt.imshow(...)。 该图看起来像这样。

plt.imshow(...)

Answer 1

您可以使用render_template来渲染Jinja2模板。

在此处查看 Flask 文档。

本质上，您将使用以下内容替换您的return jsonify(response) ：

return render_template('your_template.html', prediction=response['prediction'])

现在，您的 Jinja2 模板将在prediction模板变量中提供预测字典。

对于f1图像，您需要先以某种方式将其保存到磁盘（例如，使用plt.imsave() ，请参见此处），然后将文件的路径也传递给render_template调用，以便您可以在<img />模板中的标签。