Flask框架下reCAPTCHA表单验证不生效问题求助

问题根因 #

你的Flask路由逻辑完全没有触发FlaskForm的校验流程，所有字段规则包括reCAPTCHA校验自然不会生效，同时前端模板也存在两处语法错误导致错误提示无法正常渲染。

修复步骤 #

1. 修正Flask路由逻辑，增加表单校验判断

FlaskForm需要调用form.validate_on_submit()才会自动执行所有字段的校验规则（包括reCAPTCHA校验），只有校验通过才执行后续的存数据逻辑，校验失败会自动把错误信息写入对应字段的errors属性返回给模板。
修正后的路由代码：

@app.route('/contact', methods=["GET","POST"])
def get_contact():
    form = ContactForm()
    # 校验通过才执行后续逻辑
    if form.validate_on_submit():
        name =  form.name.data
        email = form.email.data
        message = form.message.data
        res = pd.DataFrame({'name':name, 'email':email, 'message':message}, index=[0])
        res.to_csv('./contactDatabase.csv', mode='a', header=False)
        return redirect(url_for("rgb"))
    # 校验失败/GET请求都返回表单页，自动携带错误信息
    return render_template('contact.html', form=form)

2. 修正前端模板的语法错误

• 原模板中遍历邮箱错误用了form.email.error，应为复数form.email.errors
• reCAPTCHA的错误列表ul标签位置错位，补充红色样式和其他字段保持统一
  修正后的表单代码：

<form action="{{ url_for('get_contact') }}" method=post>
    <div>
        <p>
            {{ form.csrf_token }}
            {{ form.name.label }} <br>
            {{ form.name(placeholder='Jméno') }}
            <ul>
                {% for error in form.name.errors %}
                    <li style="color:red;">{{ error }}</li>
                {% endfor %}
            </ul>
        </p>
        <p>
            {{ form.email.label }} <br>
            {{ form.email(placeholder='Email') }}
            <ul> 
                {% for error in form.email.errors %}
                   <li style="color:red;">{{ error }}</li> 
                {% endfor %}
            </ul>
        </p>
        <p>
            {{ form.message.label }}<br>
            {{ form.message(placeholder='Zpráva') }}
        </p>
        <p>
            {{ form.recaptcha }}
            <ul>
                {% for error in form.recaptcha.errors %}
                <li style="color:red;">{{ error }}</li>
                {% endfor %}
            </ul>
            <input class="contact-submit" type="submit" value="Submit">
        </p>
    </div>
</form>

3. 额外配置检查

确保你已经在Flask项目配置中正确填写了reCAPTCHA的密钥对：

app.config['RECAPTCHA_PUBLIC_KEY'] = '你申请的reCAPTCHA公钥'
app.config['RECAPTCHA_PRIVATE_KEY'] = '你申请的reCAPTCHA私钥'

内容的提问来源于stack exchange，提问作者Jm_cz12