Flask表单多空行去除功能HTML渲染异常问题排查

问题背景 #

开发了一个小型Flask应用，用户在表单输入文本后，预期输出仅去除多余空行的原文本。Python环境下用re.sub('\n\n+', '\n\n', input_text)逻辑有效，但换成HTML场景的re.sub('\n\n+', '<br><br>', input_text)时功能完全失效。

原代码 #

App.py

from flask import Flask, render_template
from flask_wtf import FlaskForm
from wtforms import TextAreaField, SubmitField
from wtforms.validators import DataRequired
import re

app = Flask(__name__)
app.config['SECRET_KEY'] = 'ehhfkdfhdf'

class KeyForm(FlaskForm):
    text = TextAreaField('Paste text', validators=[DataRequired()])
    submit = SubmitField('Submit')

@app.route('/', methods=["GET", "POST"])
def main():
    form = KeyForm()
    
    if form.validate_on_submit():
        input_text = form.text.data
        consecutive_newlines = re.findall('\n+', input_text)
        
        if len(consecutive_newlines) > 2:
            input_text = re.sub('\n\n+', '<br><br>', input_text)
        
        return render_template('index.html', form=form, result=input_text)
    
    else:
        return render_template('index.html', form=form)

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

HTML模板

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Startseite</title>
</head>
<body>

<form action="" method="post">
    {{ form.hidden_tag() }}

    <p>
        {{ form.text.label }} <br>
        {{ form.text() }}
    </p>
    <p>
        {{ form.submit() }}
    </p>
</form>

<h3>Result:</h3>
{{ result }}

</body>
</html>

问题根源 #

1. 无效的判断逻辑：代码中if len(consecutive_newlines) > 2:完全错误，re.findall('\n+', input_text)会把所有连续换行的片段作为单个列表元素，比如输入3个空行只会得到['\n\n\n']，列表长度为1，永远触发不了替换逻辑。
2. Jinja2自动转义：Flask默认的Jinja2模板会自动转义变量中的HTML特殊字符，就算执行了替换，<br><br>也会被转成<br><br>，浏览器只会显示文本，不会解析成换行。
3. 换行处理不完整：HTML中单个\n不会被解析为换行，只处理多行换行的话，原文本中的普通单换行在页面上还是会挤在一起。

修复方案 #

1. 修正后端逻辑，移除无效判断 #

删掉多余的consecutive_newlines相关代码，直接处理所有换行：

@app.route('/', methods=["GET", "POST"])
def main():
    form = KeyForm()
    
    if form.validate_on_submit():
        input_text = form.text.data
        # 把2个及以上连续换行替换成一个空行（对应两个<br>）
        input_text = re.sub(r'\n{2,}', '<br><br>', input_text)
        # 把剩余的单个换行替换成<br>，实现普通换行
        input_text = re.sub(r'\n', '<br>', input_text)
        
        return render_template('index.html', form=form, result=input_text)
    
    else:
        return render_template('index.html', form=form)

2. 关闭模板的HTML转义 #

在模板输出result时，添加|safe过滤器，告诉Jinja2这个变量包含合法HTML，不需要转义：

<h3>Result:</h3>
{{ result|safe }}

3. 可选：优化正则表达式 #

用更精准的正则避免重复替换，先处理多行换行，再处理未被替换的单行换行：

input_text = re.sub(r'\n\n+', '<br><br>', input_text)
# 只替换前面没有<br>的单个换行
input_text = re.sub(r'(?<!<br>)\n', '<br>', input_text)

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