Flask应用无法启动且Jinja模板失效问题求助

问题现象 #

• 在虚拟环境（venv）中执行python app.py启动Flask应用，程序无任何报错信息，也无响应，无法正常运行
• 直接打开index.html文件时，页面显示原始Jinja模板代码，未被解析渲染

相关文件代码 #

layout.html #

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}{% endblock title %}</title>
</head>
<body>
    <header>
        <a id="searchlink" href="index.html" class="active">Text search</a>
        <a id="imagelink" href="image.html">Images search</a>
        <a id="advansedlink" href="advansed.html">Advansed search</a>
    </header>
    {% block body %}{% endblock body %}
</body>
</html>

index.html #

{% extends "layout.html" %}
{% block title %}search{% endblock title %}

{% block body %}
    <form action="https://www.google.com/search">
        <input type="text" name="q">
        <input type="submit" value="Google Search">
    </form>
{% endblock body %}

app.py #

from flask import Flask, request, render_template

app = Flask(__name__)

@app.route("/")
def index():
    return render_template("index.html")

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

原因分析与解决办法 #

1. 直接打开HTML显示Jinja代码的问题 #

这是正常现象：浏览器直接打开本地HTML文件时，只会解析纯HTML语法，无法识别Jinja模板标签。必须通过Flask服务器渲染，模板才会被解析生成正常的HTML页面。

2. Flask启动无响应的问题 #

按以下步骤排查修复：

• 确认虚拟环境已激活：
  Windows执行venv\Scripts\activate，Linux/macOS执行source venv/bin/activate，激活后命令行前缀会显示(venv)。
• 确保Flask安装在虚拟环境中：
  激活venv后执行pip install flask，避免使用全局Python环境的Flask。
• 检查目录结构是否符合Flask要求：
  Flask默认要求模板文件放在templates文件夹下，正确结构应为：

  项目目录/
  ├── app.py
  ├── venv/
  └── templates/
      ├── layout.html
      └── index.html
  

  若templates文件夹不存在，需手动创建并将模板文件移入；也可在初始化Flask时显式指定模板路径：

  app = Flask(__name__, template_folder="./templates")
  

• 尝试更换端口启动：
  若默认5000端口被占用，修改app.run指定其他端口：

  app.run(debug=True, port=5001)
  

• 验证Python与Flask版本兼容性：
  Flask 2.x及以上版本要求Python 3.7+，确保两者版本匹配。

额外优化：修复导航链接跳转问题 #

当前layout.html中的链接指向本地HTML文件，需改为Flask路由路径，避免直接跳转到本地文件：
修改layout.html中的链接：

<a id="searchlink" href="/" class="active">Text search</a>
<a id="imagelink" href="/image">Images search</a>
<a id="advansedlink" href="/advansed">Advansed search</a>

同时在app.py中添加对应路由：

@app.route("/image")
def image():
    return render_template("image.html")

@app.route("/advansed")
def advansed():
    return render_template("advansed.html")

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