FastAPI POST重定向后JINJA2渲染HTML页面未更新问题求助

• 通过AJAX发起POST请求时，服务端返回的303重定向由AJAX引擎自动处理：AJAX会自动向/result接口发起请求、拿到渲染好的HTML内容，但该内容只会返回给AJAX的回调函数，不会触发浏览器主页面刷新渲染，因此页面始终停留在初始状态。
• 直接在地址栏访问/result时是浏览器主窗口发起的请求，拿到响应后会自动替换当前页面内容，所以可以正常显示结果。

有两种常用的修复方式，可根据业务需求选择：

• 方案1：替换AJAX为原生表单提交
  移除前端AJAX逻辑，用form表单包裹输入内容，提交时浏览器会自动处理重定向、刷新页面展示结果，代码示例：

  <form method="post" action="/eval">
    <!-- 输入控件区域 -->
    <button type="submit">提交数据</button>
  </form>
  

  对应FastAPI的/eval接口需要调整参数接收规则，改用Form类接收表单参数即可。

• 方案2：保留AJAX逻辑，手动触发页面跳转
  给AJAX添加请求成功回调，提交完成后手动控制浏览器跳转到结果页，代码示例：

  function sendData(){
      var data = ... // 采集到的用户数据
      $.ajax({
          type: 'POST',
          contentType: 'application/json',
          data: JSON.stringify({data: data}),
          url:"/eval",
          success: function() {
              // 提交成功后手动跳转至结果页，触发浏览器整页渲染
              window.location.href = "/result"
          }
      })
  }
  

  如果不需要整页刷新，也可以直接让/eval接口返回处理结果JSON，在success回调里手动更新页面DOM节点展示结果，体验更流畅。

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