Flask使用request.form.get获取值时出现NoneType错误求助

我帮你拆解下遇到的核心问题，然后一步步解决：

核心问题总结 #

1. 按钮的onclick跳转和AJAX请求冲突，导致实际发送的是不带表单数据的GET请求，而非预期的POST请求
2. Flask路由未区分请求类型，当GET访问/model时，request.form为空，导致first/second为None，触发TypeError
3. AJAX请求成功后没有正确渲染返回的页面内容

1. 修复前端表单与按钮的冲突 #

你的按钮同时设置了onclick="location.href='/model'"和AJAX点击事件，这会导致点击时同时触发页面跳转（GET请求）和AJAX POST请求，而跳转的GET请求不会携带表单数据，所以Flask拿不到用户选择的数值。

修改example.html的表单与按钮：

<form id="numberForm">
  <h2>Choose one number</h2>
  <label for="firstNumber" class="sr-only">First Number</label>
  <select name="inputFirst" id="firstNumber" required>
    <option value="1" label="One">1</option>
    <option value="2" label="Two" selected>2</option>
  </select>
  <h2> Choose another number</h2>
  <input type="radio" name="inputSecond" id="one1" value="1" required/>
  <label for="one1">1</label>
  <input type="radio" name="inputSecond" id="two2" value="2"/>
  <label for="two2">2</label>
  <!-- 移除onclick，只保留AJAX触发 -->
  <button id="btnModel" class="btn btn-lg btn-primary btn-block" type="button">Run model</button>
</form>

2. 调整AJAX代码，确保数据正确传递 #

修改model.js，阻止默认行为，确保只发送携带表单数据的POST请求，并正确处理返回的页面内容：

$(function(){
  $('#btnModel').click(function(e){
    // 阻止任何默认跳转行为
    e.preventDefault();
    $.ajax({
      url: '/model',
      data: $('#numberForm').serialize(),
      type: 'POST',
      success: function(response){
        // 将返回的结果页面替换当前页面内容
        $('body').html(response);
      },
      error: function(error){
        console.log(error);
      }
    });
  });
});

如果不想用AJAX，更简单的方式是直接用表单提交：
把按钮改成type="submit"，表单加上action和method属性，彻底去掉JS：

<form action="/model" method="POST">
  <!-- 表单内容不变 -->
  <button id="btnModel" class="btn btn-lg btn-primary btn-block" type="submit">Run model</button>
</form>

3. 完善Flask路由的请求处理 #

即使修复了前端，也要处理用户直接访问/model（GET请求）的情况，避免NoneType相加错误：

from flask import Flask, render_template, request, redirect

app=Flask(__name__)

@app.route('/')
def main():
    return render_template('example.html')

@app.route('/model',methods=['GET','POST'])
def model():
    if request.method == 'POST':
        # 仅在POST请求时获取表单数据，设置default避免None
        first = request.form.get('inputFirst', type=int, default=0)
        second = request.form.get('inputSecond', type=int, default=0)
        suma = first + second
        return render_template('final.html', suma=suma)
    # 若为GET请求，重定向回首页
    return redirect('/')

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

为什么加default=0后能运行？ #

当你通过location.href='/model'发送GET请求时，request.form是空的，request.form.get()会返回None，加上default=0后，first和second被设为0，相加不会报错，但这时候并没有用到用户选择的数字——本质是前端没把表单数据通过POST请求正确传递给Flask。

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