如何让jQuery AJAX在表单提交成功后不跟随重定向？

这个问题我之前也碰到过！核心原因是：你的AJAX请求其实已经成功触发了后端接口的逻辑，但接口返回了重定向（3xx状态码），浏览器会自动发起对重定向地址的请求，而这个新地址没配置Access-Control-Allow-Origin允许你的源（http://0.0.0.0:8000），所以触发了CORS错误，导致jQuery误判请求失败进入fail()。

下面给你两个可行的解决方案：

方案一：拦截AJAX的自动重定向（前端处理） #

通过jQuery的beforeSend钩子，我们可以给底层的XMLHttpRequest绑定自定义的状态监听，阻止它自动跟随重定向，手动处理成功逻辑：

$.ajax({
  url: 'http://example.com/signup.ashx',
  type: 'POST',
  data: $('#your-form').serialize(), // 替换成你的表单数据
  beforeSend: function(xhr) {
    // 保存原始的状态监听函数，避免覆盖默认逻辑
    const originalOnReady = xhr.onreadystatechange;
    xhr.onreadystatechange = function() {
      // 当请求完成（readyState=4）时检查状态码
      if (xhr.readyState === 4) {
        // 匹配所有重定向状态码（301/302/303等）
        if (xhr.status >= 300 && xhr.status < 400) {
          // 终止请求，阻止浏览器自动跳转
          xhr.abort();
          // 手动触发你的成功逻辑
          handleSuccess();
        } else {
          // 非重定向状态，按jQuery默认逻辑处理
          if (originalOnReady) originalOnReady.apply(this, arguments);
        }
      }
    };
  },
  success: function(response) {
    // 正常成功响应（非重定向）会走到这里
    handleSuccess();
  },
  error: function(xhr, status, err) {
    // 只有真正的请求错误（比如网络问题、500错误）才会触发这里
    console.error('请求真的出错了:', err);
  }
});

function handleSuccess() {
  // 这里写你原本想在success里执行的代码
  alert('表单提交成功！');
  // 比如刷新页面、跳转站内地址等
}

方案二：修改后端接口（根源解决） #

如果能控制后端代码，最好的方案是让接口不要返回重定向，而是直接返回JSON格式的成功响应，比如：

{ "result": "success", "message": "注册成功" }

这样浏览器不会触发自动跳转，只要后端给原接口配置好Access-Control-Allow-Origin: http://0.0.0.0:8000（生产环境不建议用*），就能正常进入jQuery的success()回调，从根源避免CORS问题。

内容的提问来源于stack exchange，提问作者NarūnasK