本教程详细介绍了如何在 flask 应用中实现多个 html 页面之间的导航。通过 `@app.route` 装饰器和 `render_template` 函数，我们将学习如何从一个 html 页面（如首页）跳转到另一个 html 页面（如注册页），并探讨了不同请求方法的处理方式，以构建结构清晰、交互流畅的 web 应用。
在构建 Flask Web 应用时，将不同的功能模块或内容展示在独立的 HTML 页面上是常见的需求。用户通过点击链接或提交表单，在这些页面之间进行跳转，从而完成一系列操作。本教程将指导您如何利用 Flask 的路由系统和模板渲染机制，实现多页面之间的无缝导航。
1. Flask 基础：路由与模板渲染
在深入页面导航之前，我们首先回顾 Flask 的两个核心概念：
- 路由 (@app.route): 路由是 URL 和 Python 函数之间的映射。当用户访问某个 URL 时，Flask 会找到对应的路由函数并执行它。
- 模板渲染 (render_template): Flask 使用 Jinja2 作为其默认模板引擎。render_template() 函数用于将 HTML 文件（模板）渲染并作为 HTTP 响应返回给浏览器。默认情况下，Flask 会在应用根目录下的 templates 文件夹中查找 HTML 文件。
为了使代码正常运行，请确保您的项目结构如下：
your_flask_app/
├── app.py
└── templates/
├── index.html
└── another_file.html2. 实现页面导航：从首页到注册页
我们将创建一个简单的 Flask 应用，包含一个首页 (index.html) 和一个注册页 (another_file.htm
l)。用户将从首页点击链接跳转到注册页。
2.1 定义 Flask 应用和初始路由
首先，在 app.py 中初始化 Flask 应用，并定义一个处理根路径 / 的路由，该路由将渲染 index.html。
# app.py
from flask import Flask, render_template, request
app = Flask(__name__)
@app.route('/')
def index():
"""
处理根路径 '/' 的请求，渲染首页。
"""
return render_template("index.html")
if __name__ == '__main__':
app.run(debug=True)2.2 创建首页 (index.html)
在 templates/index.html 文件中，我们将创建一个简单的 HTML 页面，其中包含一个指向注册页的链接。
欢迎来到首页
欢迎来到 Flask 应用首页
点击下方链接进入注册页面：
点击注册
注意 标签的 href="/register" 属性，它指向了我们即将定义的 /register 路由。
2.3 定义注册页路由与创建注册页 (another_file.html)
接下来，在 app.py 中定义一个处理 /register 路径的路由，该路由将渲染 another_file.html。
# app.py (在现有代码基础上添加)
# ... (之前的导入和 app = Flask(__name__))
@app.route('/')
def index():
# ... (同上)
return render_template("index.html")
@app.route('/register', methods=['GET', 'POST'])
def register():
"""
处理 '/register' 路径的请求。
- GET 请求：显示注册表单页面。
- POST 请求：处理表单提交数据（此处为示例，实际应处理数据）。
"""
if request.method == "GET":
return render_template("another_file.html")
elif request.method == "POST":
# 实际应用中，这里会获取表单数据，进行验证，保存到数据库等操作
username = request.form.get('username')
password = request.form.get('password')
print(f"收到注册请求 - 用户名: {username}, 密码: {password}")
# 注册成功后可以重定向到成功页面或登录页面
return f"注册成功，欢迎用户: {username}！" # 简单示例响应
# else: # 对于未明确允许的请求方法，Flask 会自动返回 405 Method Not Allowed
# pass在 templates/another_file.html 文件中，我们将创建一个包含简单注册表单的页面。
注册页面
用户注册
请填写以下信息进行注册。
返回首页
在这个注册页中，我们创建了一个 HTML 表单，其 action 属性同样指向 /register，method 属性设置为 post。这意味着当用户点击“提交注册”按钮时，浏览器会向 /register URL 发送一个 POST 请求，并将表单数据包含在请求体中。
3. 处理不同请求方法 (GET/POST)
在上述 /register 路由函数中，我们使用了 request.method 来区分 GET 和 POST 请求：
- request.method == "GET": 当用户直接通过浏览器地址栏访问 /register 或点击一个普通链接时，会发送 GET 请求。此时，我们渲染并返回注册表单页面。
- request.method == "POST": 当用户填写表单并点击提交按钮时，会发送 POST 请求。此时，我们可以在 elif request.method == "POST" 代码块中处理表单提交的数据（例如，从 request.form 中获取用户名和密码，进行验证，然后保存到数据库等）。
通过在 @app.route 装饰器中添加 methods=['GET', 'POST']，我们明确告诉 Flask 这个路由可以处理 GET 和 POST 两种请求。如果未指定 methods 参数，则默认只允许 GET 请求。
4. 运行应用与验证
- 确保您已安装 Flask (pip install Flask)。
- 将上述 app.py、templates/index.html 和 templates/another_file.html 文件放置在正确的项目结构中。
- 在终端中导航到 your_flask_app 目录，并运行 python app.py。
- 打开浏览器，访问 http://127.0.0.1:5000/。您将看到首页。
- 点击“点击注册”链接，页面将跳转到注册页。
- 在注册页填写用户名和密码，点击“提交注册”，您将看到 Flask 应用返回的“注册成功”消息。
5. 注意事项与最佳实践
- 模板文件夹: 始终将 HTML 模板文件放在 Flask 应用根目录下的 templates 文件夹中。
- URL 命名规范: 使用清晰、有意义的 URL 路径，例如 /users/register 而不是 /reg。
- 表单处理: 对于实际的注册功能，您需要对用户输入进行严格的验证，并妥善处理用户数据（例如，密码哈希存储）。
-
重定向: 在处理完 POST 请求（如表单提交）后，通常建议使用 redirect(url_for('route_name')) 进行重定向，而不是直接渲染模板。这可以避免用户刷新页面时重复提交表单（Post/Redirect/Get 模式）。例如：
from flask import redirect, url_for # ... elif request.method == "POST": # ... 处理数据 ... return redirect(url_for('success_page')) # 假设有一个名为 'success_page' 的路由 - 错误处理: 考虑如何处理无效的输入或服务器错误。
- 模块化: 随着应用规模的增长，可以考虑使用 Flask 蓝图 (Blueprints) 来组织路由和视图函数，提高代码的可维护性。
总结
通过本教程，您已经掌握了在 Flask 应用中实现 HTML 页面之间导航的基本方法。理解 @app.route 和 render_template 的工作原理，以及如何处理不同 HTTP 请求方法，是构建任何 Flask Web 应用的关键。遵循良好的实践，您将能够构建出结构清晰、功能完善的多页面 Flask 应用。
