HTML表单数据传递至Python Flask报错排查请求

核心问题分析 #

出现400 Bad Request错误有两个关键原因：

• 表单字段名不匹配：add.html中书名输入框的name属性是book-name，但main.py里尝试获取request.form['bookName']，两者名称不一致，导致Flask找不到对应参数。
• 未区分请求方法：/add路由同时支持GET和POST，但无论哪种请求都直接读取request.form，而GET请求没有表单数据，访问/add页面时就会触发错误。

修复后的代码 #

main.py #

from flask import Flask, render_template, request, redirect, url_for

app = Flask(__name__)

all_books = []


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


@app.route('/add', methods=['GET', 'POST'])
def add():
    # 仅在POST请求时处理表单数据
    if request.method == 'POST':
        book_name = request.form['book-name']  # 与表单name属性匹配
        book_author = request.form['book-author']
        book_rating = request.form['book-rating']
        return f"<h1>Name: {book_name}, Author: {book_author}, Rating: {book_rating}</h1>"
    # GET请求时渲染添加页面
    return render_template('add.html')


if __name__ == "__main__":
  app.run(host='0.0.0.0', debug=True)

add.html（保持原字段名即可） #

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Add Book</title>
</head>
<body>
  <form action="/add" method="post">
    <label>Book Name</label>
    <input type="text" id="bookName" name="book-name">
    <label>Book Author</label>
    <input type="text" id="book-author" name="book-author">
    <label>Rating</label>
    <input type="text" id="book-rating" name="book-rating">
    <button type="submit">Add Book</button>
  </form>
</body>
</html>

修复说明 #

• 修正表单字段名匹配问题：将main.py中获取书名的键改为book-name，与add.html里的name属性完全一致。
• 增加请求方法判断：只有当请求是POST时才读取表单数据，GET请求时正常渲染add.html页面，避免访问页面时触发错误。

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