Flask从MySQL取数据到HTML页面不显示问题求助

核心问题与修复步骤 #

1. 路由装饰器语法错误 #

你的app.route('/display', methods=['GET'])缺少**@符号**，这是Flask路由的必填语法，没有@的话路由不会被注册，访问/display时根本不会执行display()函数。

修复：

@app.route('/display', methods=['GET'])  # 添加@符号
def display():
    # ... 原有代码

2. 模板变量名不匹配 #

你在render_template里传递的变量是info_table=data，但HTML模板里循环的是data，两者名称不对应，模板找不到数据自然无法渲染。

修复二选一：

• 修改Python代码，统一变量名：

  return render_template('display.html', data=data)
  

• 或者修改HTML模板，匹配传递的变量名：

  {% for row in info_table %}
  

3. HTML文件语法错误 #

HTML第一行的t<!DOCTYPE html>多了个t字符，会导致页面解析异常，必须删掉。

修复后第一行：

<!DOCTYPE html>

4. Flask运行端口冲突 #

你设置app.run(port=3306)，但3306是MySQL的默认端口，Flask用这个端口会和数据库服务冲突，导致Flask无法正常启动。

修复：改用Flask默认端口5000或其他未被占用的端口：

app.run(host='localhost', port=5000)

5. 数据库HOST配置缺失 #

app.config['MYSQL_HOST'] = ''为空，虽然你说连接成功，但建议明确填写数据库地址（本地数据库填'localhost'），避免潜在连接问题：

app.config['MYSQL_HOST'] = 'localhost'

修复后的完整代码 #

app.py #

from flask import Flask, render_template, request
from flask_mysqldb import MySQL

app = Flask(__name__)
app.debug = True

# 完善数据库配置
app.config['MYSQL_HOST'] = 'localhost'
app.config['MYSQL_USER'] = 'root'
app.config['MYSQL_PASSWORD'] = ''  # 填入你的数据库密码
app.config['MYSQL_DB'] = 'DB'

mysql = MySQL(app)

# 修复路由装饰器
@app.route('/display', methods=['GET'])
def display():
    cursor = mysql.connection.cursor()
    cursor.execute("SELECT * FROM info_table")
    data = cursor.fetchall()
    # 确保变量名和模板一致
    return render_template('display.html', data=data)

# 修复端口问题
app.run(host='localhost', port=5000)

display.html #

<!DOCTYPE html>
<html>
<head>
 <title>用户信息展示</title>
</head>
<body>
<style>
 td {
        width: 150px;
        text-align: center;
        border: 1px solid black;
        padding: 5px;
      }
 th {
        border: 1px solid black;
        padding: 5px;
        background-color: #f0f0f0;
      }
</style>
<table>
  <thead>
    <tr>
        <th>name</th>
        <th>age</th>
    </tr>
    </thead>
    <tbody>
     {% for row in data %}
            <tr>
                <td>{{row[0]}}</td>
                <td>{{row[1]}}</td>
            </tr>
        {% endfor %}
    </tbody>
</table>
</body>
</html>

可选优化：使用字典游标 #

如果想在模板里直接用字段名（比如{{row.name}}）而不是索引，可以改用字典游标，代码修改如下：

@app.route('/display', methods=['GET'])
def display():
    # 使用字典游标
    cursor = mysql.connection.cursor(mysql.cursors.DictCursor)
    cursor.execute("SELECT * FROM info_table")
    data = cursor.fetchall()
    return render_template('display.html', data=data)

模板里就可以这样写：

{% for row in data %}
    <tr>
        <td>{{row.name}}</td>
        <td>{{row.age}}</td>
    </tr>
{% endfor %}

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