Flask POST请求后浏览器跳转至目标URL的技术疑问

我的Flask应用首页有一个接收用户输入的HTML表单，表单通过POST请求把用户输入发送到/output端点，处理后返回简单结果。但奇怪的是，返回结果时浏览器的URL变成了/output。我一直以为POST请求不会改变浏览器URL，只有GET请求才会导航到新URL。另外我已经把/output端点设置为仅接受POST请求，所以确定后台没有执行GET请求（环境：Windows系统下的Google Chrome浏览器）。

难道Flask不管请求是POST还是GET，都会自动在指定端点返回结果？那这样的话，浏览器地址栏的URL变化并不全代表GET请求？我从来没对/output做过重定向或者发起GET请求，作为Web开发新手完全搞不懂，求各位解惑！

最小可复现示例（MRE） #

app.py #

from flask import Flask, request, render_template

app = Flask(__name__)

@app.route('/', methods=['GET'])
def index():
    return render_template('form.html')

@app.route('/output', methods=['POST'])  # 仅接受POST请求
def output():
    return 'A POST request was made; input1 = ' + request.form.get('input1')
    # 返回后浏览器导航到了/output...这是怎么回事？

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

form.html #

<form action="/output" method="post">
Input 1: <input type="string" name="input1">
<input type="submit">
</form>

问题解答 #

这是浏览器处理原生表单POST请求的默认行为，和Flask无关：

• 点击表单提交按钮时，浏览器会直接向action指定的/output发送POST请求，服务器处理后返回响应内容，浏览器就会替换当前页面为该响应，同时地址栏更新为/output。
• 你之前的误解是混淆了AJAX异步POST和表单同步POST：AJAX发送POST请求时不会刷新页面，地址栏也不会改变；但原生表单的同步POST请求本质上就是一次页面导航，只是请求方法为POST，浏览器会加载响应并更新地址栏。

如果想保持URL不变，有两种常用方案：

1. 使用AJAX异步提交：用JavaScript的fetch或其他库发送POST请求，处理响应后动态更新页面内容，全程不刷新页面。
2. 重定向回原页面：在/output端点处理完请求后，用Flask的redirect重定向回首页，同时通过flash传递处理结果。示例代码如下：

修改后的app.py：

from flask import Flask, request, render_template, redirect, url_for, flash

app = Flask(__name__)
app.secret_key = 'your-custom-secret-key'  # 使用flash必须设置密钥

@app.route('/', methods=['GET'])
def index():
    return render_template('form.html')

@app.route('/output', methods=['POST'])
def output():
    input_content = request.form.get('input1')
    flash(f'已收到输入：{input_content}')
    return redirect(url_for('index'))

修改后的form.html（添加flash消息显示，同时修正输入类型错误）：

{% with messages = get_flashed_messages() %}
  {% if messages %}
    {% for message in messages %}
      <div style="color: green;">{{ message }}</div>
    {% endfor %}
  {% endif %}
{% endwith %}

<form action="/output" method="post">
Input 1: <input type="text" name="input1"> <!-- HTML无string类型，应使用text -->
<input type="submit" value="提交">
</form>

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