如何阻止jQuery Ajax自动跟随302重定向并获取重定向URL

首先得明确问题的核心：jQuery的$.ajax默认会自动跟随HTTP 3xx重定向，所以你现在虽然能拿到content-location响应头，但浏览器其实已经悄悄完成了重定向请求，直接把那个一次性URL给消耗掉了。要解决这个问题，我们得直接控制底层的XMLHttpRequest对象，阻止它自动跳转。

具体实现方案 #

我们可以通过$.ajax的xhrFields配置项，给底层XMLHttpRequest设置redirect: 'manual'属性（这是现代浏览器都支持的XMLHttpRequest Level 2标准特性），同时在complete回调里处理302响应：

$.ajax({
  type: 'GET',
  url: url1,
  // 配置底层XHR不自动跟随重定向
  xhrFields: {
    redirect: 'manual'
  },
  // 覆盖默认error回调，避免jQuery因302状态抛出错误干扰逻辑
  error: function() {},
  complete: function(xhr) {
    // 检查响应状态码是否为302重定向
    if (xhr.status === 302) {
      var sdurl = xhr.getResponseHeader('content-location');
      // 这里拿到的sdurl就是未被使用的有效一次性URL
      finishedfunction(url1, url2, sdurl);
    } else {
      // 可根据需求处理其他状态码的情况
      console.log('请求未返回302重定向，状态码：', xhr.status);
    }
  }
});

关键细节说明 #

• redirect: 'manual'：这个属性会让浏览器停止自动跟随重定向，直接把302响应返回给我们，这样就能在重定向发生前拿到content-location，保证URL的有效性。
• 用complete回调：设置redirect: 'manual'后，302响应不会触发success回调，反而会进入error逻辑，用complete能统一处理所有状态的响应，更稳妥。
• 禁用默认error回调：如果不手动覆盖，jQuery会因为302状态码抛出错误，打断我们的正常流程。

兼容性备选方案 #

如果需要兼容IE11这类老旧浏览器（它们不支持redirect属性），可以直接用原生XMLHttpRequest实现：

var xhr = new XMLHttpRequest();
xhr.open('GET', url1);
xhr.onload = function() {
  // 老旧浏览器中302会触发onload，但响应内容是重定向后的结果，
  // 这时候需要通过getAllResponseHeaders()手动解析location头
  // 注意：这种情况下仍可能存在URL被提前消耗的问题，建议优先用现代浏览器方案
  var headers = xhr.getAllResponseHeaders();
  var locationMatch = headers.match(/location: (.+)/i);
  if (locationMatch) {
    var sdurl = locationMatch[1].trim();
    finishedfunction(url1, url2, sdurl);
  }
};
xhr.send();

这样就能完美解决你的问题，拿到未被使用的一次性重定向URL了。

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