Ajax请求出现“Response for preflight is invalid (redirect)”错误如何解决？

这个问题我之前也碰到过，核心原因是浏览器的CORS预请求机制和Postman的请求逻辑差异导致的：

为什么Postman正常但浏览器报错？ #

Postman不会触发浏览器的跨域资源共享（CORS）规则，它直接发送你指定的GET请求。但浏览器在处理跨域请求时，如果请求包含自定义头部（比如你的Authorization）、非简单HTTP方法，或者设置了特殊的Content-Type，会先自动发送一个OPTIONS预请求到服务器，用来确认服务器是否允许该跨域请求。如果服务器对这个OPTIONS请求返回了重定向（3xx状态码），浏览器就会判定“预请求响应无效”，直接拦截后续的GET请求，也就是你看到的Response for preflight is invalid (redirect)错误。

具体修复步骤 #

1. 检查并修复API服务器的CORS配置

如果API服务器是你可控的，必须确保它正确处理OPTIONS预请求：

• 让OPTIONS请求返回200或204状态码，绝对不能返回重定向
• 配置必要的CORS响应头：
  • Access-Control-Allow-Origin：指定允许跨域请求的前端域名（比如你的前端是http://localhost:3000就填这个，不要用*，因为带Authorization头时*不被浏览器允许）
  • Access-Control-Allow-Headers：必须包含你请求里用到的自定义头部，比如Authorization、Accept
  • Access-Control-Allow-Methods：要包含GET（以及其他你需要的方法）

比如在Node.js中使用cors中间件的配置示例：

const cors = require('cors');
app.use(cors({
  origin: 'http://your-frontend-domain.com',
  allowedHeaders: ['Authorization', 'Accept'],
  methods: ['GET', 'OPTIONS']
}));

2. 简化不必要的请求头

你的GET请求里设置了Content-Type: application/json，但GET请求通常没有请求体，这个头部是多余的——它会让浏览器判定这是“复杂请求”，强制触发预请求。试试去掉这个头部，修改后的代码如下：

$.ajax({
  type: 'GET',
  dataType:'json',
  headers: {
    "Authorization":"Basic Ym86Ym8=",
    "Accept":"application/json"
  },
  success(data, response) {
    console.log(data, response);
  },
  url: 'http://##########/bo/api/v1/transactions/'
});

3. 确认URL是否触发重定向

检查你的API服务器是否有URL重定向规则（比如把不带斜杠的URL重定向到带斜杠的，反之亦然）。如果预请求的URL触发了重定向，浏览器会直接报错。你可以在Chrome开发者工具的“Network”面板里查看OPTIONS请求的响应状态码，确认是否存在重定向，然后调整URL或者修改服务器的重定向规则。

总结 #

如果服务器不是你可控的，你需要联系API提供者修复他们的CORS配置；如果服务器是你自己的，按照上面的步骤调整CORS设置和请求头，应该就能解决问题了。

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