如何在Flask应用中实现始终重定向至同一页面的功能？

核心思路 #

通过后端会话（Session）跟踪处理流程状态，结合路由拦截确保用户在流程未完成时无法访问其他页面；前端配合实时监听状态，提升用户体验。

后端实现（Flask 核心逻辑） #

1. 初始化Session配置
   确保Flask应用开启Session支持，用于存储处理状态：

from flask import Flask, session, redirect, url_for, render_template, request, jsonify
import time
from threading import Thread

app = Flask(__name__)
app.secret_key = 'your_secret_key_here'  # 必须设置，用于加密Session

2. 定义状态检查装饰器
   写一个装饰器，拦截所有需要限制的路由，若流程未完成则重定向到处理页面：

def check_process_completed(f):
    def wrapper(*args, **kwargs):
        if session.get('process_running', False):
            # 流程未完成，强制跳转到处理页面
            return redirect(url_for('processing_page'))
        return f(*args, **kwargs)
    wrapper.__name__ = f.__name__
    return wrapper

3. 处理流程与状态控制

• 启动处理流程的路由：将Session标记为处理中，后台异步执行任务（避免阻塞请求）
• 处理页面路由：无论用户如何访问，只要流程未完成就返回该页面；完成后清除状态并跳转

def background_process():
    # 模拟耗时处理任务（替换为你的实际业务逻辑）
    time.sleep(10)
    # 处理完成后更新Session状态
    session['process_running'] = False

@app.route('/start-process')
def start_process():
    session['process_running'] = True
    # 后台启动处理任务，不阻塞当前请求
    Thread(target=background_process).start()
    return redirect(url_for('processing_page'))

@app.route('/processing')
def processing_page():
    if not session.get('process_running', False):
        # 流程已完成，跳转到操作完成后的页面
        return redirect(url_for('completed_page'))
    return render_template('processing.html')

# 受限制的路由，必须流程完成后才能访问
@app.route('/dashboard')
@check_process_completed
def dashboard():
    return render_template('dashboard.html')

@app.route('/completed')
def completed_page():
    return '<h1>处理完成！现在可以自由操作了</h1>'

4. 提供状态查询接口
   供前端实时获取处理状态，避免页面反复刷新：

@app.route('/check-process-status')
def check_process_status():
    return jsonify({'completed': not session.get('process_running', False)})

前端实现（processing.html） #

1. 实时监听处理状态
   使用AJAX轮询检查状态，完成后自动跳转：

<!DOCTYPE html>
<html>
<head>
    <title>处理中...</title>
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
</head>
<body>
    <h2>正在处理，请稍候...</h2>
    <div id="progress">处理进行中...</div>

    <script>
        // 每2秒查询一次状态
        const checkInterval = setInterval(() => {
            $.get('/check-process-status', function(data) {
                if (data.completed) {
                    clearInterval(checkInterval);
                    // 跳转到完成页面或其他允许访问的页面
                    window.location.href = '/completed';
                }
            });
        }, 2000);

        // 拦截浏览器回退事件，辅助加强限制（主要依赖后端路由拦截）
        window.addEventListener('popstate', function() {
            window.location.href = '/processing';
        });
    </script>
</body>
</html>

2. 辅助限制（可选）
   可以添加CSS禁用页面内的链接/按钮（但核心限制仍需后端控制，避免前端被绕过）：

a, button {
    pointer-events: none;
    opacity: 0.5;
}

关键注意事项 #

• Session可靠性：确保Flask的Session配置正确，生产环境建议使用Redis等持久化存储Session，避免服务器重启丢失状态。
• 异步任务：实际业务中，后台处理任务建议使用Celery等专业异步任务框架，而非简单的Thread，避免进程管理问题。
• 前端绕过问题：所有页面访问权限必须由后端控制，前端限制仅为体验优化，不能替代后端校验。

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