jQuery Ajax请求成功后如何以POST方式重定向到目标URL

window.location.href 仅能触发GET方式的页面跳转，无法满足POST请求访问/pro_account的需求，最稳妥、兼容性最好的实现方式是在Ajax成功回调中动态创建隐藏表单，通过原生表单提交完成POST跳转，具体修改后的代码如下：

$.ajax({
    type: "POST",
    url: "/pro_signup",
    data: { data: data, key: key },
    dataType: "json",
    success: function (response) {
      document.getElementById("purchase").innerHTML =
        '<button class="btn btn-primary button-connected">Verifying...</button><p class="grey-text">Waiting for verification...</p>';

      // 动态构建隐藏表单发起POST跳转
      const jumpForm = document.createElement('form');
      jumpForm.method = 'POST';
      jumpForm.action = '/pro_account';

      // 若需要向/pro_account传递参数，可新增隐藏输入框，示例如下
      // const csrfInput = document.createElement('input');
      // csrfInput.type = 'hidden';
      // csrfInput.name = 'csrf_token';
      // csrfInput.value = '你的CSRF令牌值';
      // jumpForm.appendChild(csrfInput);

      document.body.appendChild(jumpForm);
      jumpForm.submit();
    },
    error: function (exception) {
      document.getElementById("purchase").innerHTML =
        '<button class="btn btn-primary button-error">Failed</button><p class="grey-text">Verification has failed.</p>';
    },
});

注意事项 #

• 该方案利用浏览器原生表单提交逻辑，提交后会正常跳转到目标页面、同步更新浏览器地址栏，和普通用户手动提交表单的行为完全一致，完美适配Flask端仅接受POST的路由规则。
• 不推荐直接修改Flask路由放开GET请求权限，既违背了接口设置POST方法的安全设计初衷，也会导致参数暴露在URL中，存在安全风险。
• 不推荐用Ajax直接请求/pro_account后手动替换页面内容，这种方式不会更新浏览器地址栏，用户刷新页面会回退到之前的路径，不符合常规页面跳转的交互预期。
• 如果你的Flask项目开启了CSRF防护，记得在动态表单中加入对应的CSRF token隐藏字段，否则会被防护机制拦截请求。

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