如何通过Flask应用访问HTML页面并实现页面跳转？

以下是具体实现步骤，涵盖项目结构、Flask后端代码和前端HTML页面编写：

1. 搭建基础项目结构 #

确保项目包含Flask要求的templates文件夹（用于存放HTML文件），结构如下：

your_flask_project/
├── app.py          # Flask主应用文件
└── templates/
    ├── index.html  # 初始注册页面
    └── welcome.html# 注册成功后跳转的页面

2. 编写Flask后端代码（app.py） #

导入必要模块，定义路由处理页面渲染和重定向逻辑：

from flask import Flask, render_template, redirect, url_for

app = Flask(__name__)

# 渲染初始注册页面
@app.route('/')
def home():
    return render_template('index.html')

# 处理注册请求，完成后重定向到欢迎页面
@app.route('/register', methods=['POST'])
def register():
    # 这里可添加实际注册逻辑：
    # 1. 获取表单提交的用户数据（如request.form.get('username')）
    # 2. 验证数据合法性
    # 3. 将数据存入数据库
    # 完成逻辑后执行重定向
    return redirect(url_for('welcome'))

# 渲染欢迎页面
@app.route('/welcome')
def welcome():
    return render_template('welcome.html')

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

3. 编写前端HTML页面 #

初始注册页面（templates/index.html） #

通过表单提交请求到Flask的/register路由，点击注册按钮触发提交：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>用户注册</title>
</head>
<body>
    <h2>用户注册</h2>
    <!-- 使用url_for生成路由地址，避免硬编码 -->
    <form action="{{ url_for('register') }}" method="POST">
        <div>
            <label>用户名：</label>
            <input type="text" name="username" required>
        </div>
        <div>
            <label>密码：</label>
            <input type="password" name="password" required>
        </div>
        <button type="submit">注册</button>
    </form>
</body>
</html>

欢迎页面（templates/welcome.html） #

注册成功后跳转的目标页面：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>注册成功</title>
</head>
<body>
    <h2>注册成功！</h2>
    <p>感谢你的注册，现在可以开始使用服务了。</p>
</body>
</html>

关键说明 #

• 使用url_for('路由函数名')生成路由地址，比硬编码URL更灵活，后续修改路由规则时无需手动更新HTML中的地址。
• 如果不需要处理表单数据，仅需简单跳转，也可以用<a href="{{ url_for('welcome') }}">注册</a>实现GET请求跳转，但这种方式不适合提交敏感数据（如密码）。
• debug=True仅用于开发阶段，生产环境部署时务必关闭。

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