【python】Flask如何利用flash提示登录失败

在编写登录或者注册页面时，一个必不可少的环节就是如何在用户登录失败或者注册失败时给出响应的提示信息，举个例子：

如何给出上述的红色提示信息呢？其实很简单，只需要两步。

第一步，在登录和主页的视图函数部分编写flash消息（@login是我注册的蓝图）。把它们放在条件判断失败的地方

@login.route('/', methods=['GET', 'POST'])
@login.route('/login', methods=['GET', 'POST'])
def login_():
    if request.method == 'POST':
        count = request.form['count']
        password = request.form['password']
        if not count or not password:
            flash('请输入账号和密码!')
            return redirect(url_for('login.login_'))
        user = User.query.filter_by(count=count).first()

        if not user:
            flash("用户不存在")
            return redirect(url_for('login.login_'))

        if count == user.count and user.check_password(password):
            login_user(user)  # 登入用户
            return redirect(url_for('login.index'))  # 重定向到主页

        flash('账号或密码不正确, 请重新登录!')  # 如果验证失败，显示错误消息
        return redirect(url_for('login.login_'))  # 重定向回登录页面
    return render_template('login.html')

@login.route('/register', methods=['GET', 'POST'])
def register():
    # 如果请求为post
    if request.method == 'POST':
        count = request.form.get('count')
        password = request.form.get('password')
        repassword = request.form.get('repassword')
        from app import db
        if password == repassword:
            user = User(count, password)
            user.set_password(password)
            db.session.add(user)
            db.session.commit()
            return redirect(url_for("login.login_"))
        else:
            flash("两次密码不一致!")
            return render_template("register.html")
    return render_template('register.html')

第二步，在前端页面利用jinja2模板语法接收flash消息，并把他们放在正确的位置。我这里选择放在h2标题正下方，样式是tip等会列出

======这是登录的页面=======
<div class="login-box">
    <h2 style="color: #ce8483; font-family: 华文彩云">榕城佳人</h2>
    <p class="tip">
        {% for item in get_flashed_messages() %}
            {{ item }}
        {% endfor %}
    </p>
    <form action="/login" method="post">
        <div class="login-field">
            <span style="color: aqua; size: 12px">账号</span>
            <input type="text" name="count" required=""/>
        </div>
        <div class="login-field">
            <spqn style="color: aqua; size: 12px">密码</spqn>
            <input type="password" name="password" required=""/>
        </div>
        <input type="submit" value="点击进入" id="myloginlabel">
        <p style="color: rgba(222,112,112,0.58)">没有账号？<a href="./register" style="color: rgba(22,180,166,0.58)"
                                                             onclick="topggleForm();">注册</a></p>
    </form>
</div>

======这是注册页面======
<div class="login-box">
    <h2>注册</h2>
    <p class="tip">
        {% for item in get_flashed_messages() %}
            {{ item }}
        {% endfor %}
    </p>
    <form action="/register" method="post">
        <div class="login-field">
            <span style="color: aqua; size: 12px">账号</span>
            <input type="text" name="count" required=""/>
        </div>
        <div class="login-field">
            <spqn style="color: aqua; size: 12px">密码</spqn>
            <input type="password" name="password" required=""/>
        </div>
        <div class="login-field">
            <spqn style="color: aqua; size: 12px">确认密码</spqn>
            <input type="password" name="repassword" required=""/>
        </div>
        <input type="submit" value="提交" id="myloginlabel">
        <p style="color: rgba(194,108,108,0.58)">已有账号？<a href="./login" style="color: rgba(22,180,166,0.58)"
                                                             onclick="topggleForm();">登录</a></p>
    </form>
</div>

这里是tip样式

.tip{
    font-size:14px;
    color: red;
    text-align: center;
    margin: 10px;
    margin-top: -10px;
}

这样子就可以搞定啦