Flask 表单提交后显示成功或失败消息的完整教程

本文旨在指导开发者在使用 Flask 框架构建的 Web 应用中，如何在表单提交后显示成功或失败消息。通过利用 Flask 的模板引擎和条件语句，我们可以根据表单处理的结果，向用户提供即时的反馈。本文将提供详细的代码示例和步骤，帮助你轻松实现这一功能。

利用 Flask 模板引擎显示消息

在 Flask 应用中，最常用的方法是在后端处理表单提交，并在模板中显示相应的消息。这种方法利用了 Flask 的模板引擎（通常是 Jinja2）的强大功能，允许我们根据变量的值动态地渲染 HTML 内容。

1. 后端 Flask 代码修改

首先，我们需要在 Flask 的路由函数中，根据表单处理的结果设置一个变量，并将该变量传递给模板。

from flask import Flask, render_template, request
import smtplib

MY_EMAIL = "your email"
MY_PASSWORD = "your pw"

app = Flask(__name__)

@app.route('/', methods=["GET", "POST"])
def home():
    success = False  # 初始化 success 变量
    if request.method == "POST":
        data = request.form
        print(data["name"])
        print(data["email"])
        print(data["phone"])
        print(data["message"])

        try:
            with smtplib.SMTP("smtp.gmail.com", port=587) as connection:
                connection.starttls()
                connection.login(user=MY_EMAIL, password=MY_PASSWORD)
                connection.sendmail(
                    from_addr=MY_EMAIL,
                    to_addrs=MY_EMAIL,
                    msg=f"Subject:New Message\n\nName: {data['name']}\nEmail: {data['email']}\nPhone: {data['phone']}\nMessage: {data['message']}"
                )
            success = True  # 邮件发送成功
        except Exception as e:
            print(f"Error sending email: {e}")
            success = False  # 邮件发送失败

        return render_template("index.html", success=success)
    return render_template("index.html", success=False)

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

在这个例子中，我们添加了一个 success 变量，它的值取决于邮件是否成功发送。然后，我们将 success 变量传递给 index.html 模板。

注意: 务必处理异常情况，例如邮件发送失败，并将 success 设置为 False，以便在前端显示错误消息。

Shakespeare

一款人工智能文案软件，能够创建几乎任何类型的文案。

下载

2. 前端 HTML 代码修改

接下来，我们需要在 HTML 模板中使用 Jinja2 的条件语句来显示成功或失败消息。

    

        

            
Contact Me
            

            If you are interested in me, I would love to hear it.
            
        
        

            
            

                

                    

                        
                        
                        
A name is required.
                    
                    

                        
                        
                        
An email is required.
                        
Email is not valid.
                    
                    

                        
                        
                        
A phone number is required.
                    
                
                    

                        

                            
                            
                            
A message is required.
                        
                    
                

            
            

                Send Message
            
        

        
        {% if success %}
            

                邮件已成功发送！
            
        {% else %}
            

                邮件发送失败，请检查您的网络连接或稍后再试。
            
        {% endif %}
    

在这个例子中，我们使用了 {% if success %} 和 {% else %} 语句来根据 success 变量的值显示不同的消息。如果 success 为 True，则显示成功消息；否则，显示失败消息。使用了 Bootstrap 的 alert 类来美化消息框。

3. 代码解释和注意事项

• success 变量： 这个变量用于指示表单处理是否成功。在 Flask 代码中，根据实际情况设置它的值。
• Jinja2 条件语句： {% if ... %}、{% else %} 和 {% endif %} 是 Jinja2 模板引擎的条件语句，用于根据条件动态地渲染 HTML 内容。
• 错误处理： 在实际应用中，务必进行完善的错误处理，以便向用户提供更友好的错误提示。
• 安全性： 始终对用户输入进行验证和清理，以防止安全漏洞。

4. 总结

通过结合 Flask 的后端处理和 Jinja2 的前端模板，我们可以轻松地在表单提交后显示成功或失败消息。这种方法简单易懂，适用于各种 Web 应用。记住，良好的错误处理和用户反馈是构建高质量 Web 应用的关键。