Flask表单提交无响应 form数据无法发送未处理问题排查

问题根因 #

1. HTML表单提前闭合：你代码第一行写完<form action= '{{url_for('predict')}}' method="POST" id="form">之后直接加了</form>，导致后续所有输入控件、提交按钮都不在表单范围内，点击提交按钮不会触发任何表单提交行为，所以终端没有新的请求日志。
2. 表单字段名与Flask后端取值不匹配：即使修复表单闭合问题，后续提交也会因为字段名不一致报错，具体不匹配项：
   • 前端燃油类型select的name是fuel，后端用request.form["fuel-type"]取值
   • 前端变速箱类型select的name是transmission，后端用request.form["transmission-type"]取值
   • 前端卖家类型select的name是seller-type，后端用request.form["seller_type"]取值

修复步骤 #

第一步：修复HTML表单结构 #

删掉第一行form标签后面多余的</form>，修正后开头的form标签为：

<form action= '{{url_for('predict')}}' method="POST" id="form">

保留页面末尾的</form>即可，确保所有输入控件、提交按钮都在form标签包裹范围内。

第二步：统一前后端字段名 #

可以选择修改前端控件的name属性，或者修改后端的取值key，这里以修改后端代码为例，把Flask代码里对应的取值行替换为：

# 替换原fuel_type取值逻辑
fuel_type = request.form["fuel"]
# 替换原transmission取值逻辑
transmission = request.form["transmission"]
# 替换原seller_type取值逻辑
seller_type = request.form["seller-type"]

可选优化：修正车主数量下拉框取值 #

当前车主数量下拉框0和1的选项value都是1，会导致取值不准，可修改为：

<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>

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