为什么我的跨域请求总触发预检？

极客佩佩提问于 2026-03-25 08:59:16 阅读 30

安全

我用 fetch 发了个 POST 请求，带了自定义 header，结果浏览器先发了个 OPTIONS 请求，后端没处理就直接 404 了。

明明只是想传个 X-Auth-Token，为啥会触发 CORS 预检？简单请求不是不会预检吗？

我试过把 Content-Type 改成 application/json，还是不行。后端同事说他们只允许特定 header，但我不确定到底哪些组合会触发预检。

这是我的请求代码：

fetch('https://api.example.com/data', {
  method: 'POST',
  headers: {
    'X-Auth-Token': 'abc123',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ name: 'test' })
})

CORS安全 CORS预检

我来解答赞 5 收藏

反馈

2 条解答

Newb.利娟 Lv1

你这个问题就是因为用了自定义header X-Auth-Token，这肯定会触发CORS预检。让后端同事在服务器配置里加上对这个header的支持，像这样：

Access-Control-Allow-Headers: X-Auth-Token, Content-Type

记得让他们也处理OPTIONS请求，返回200状态码就行。这种跨域问题最烦人了，我都处理过无数次。

2026-03-29 19:05

设计师紫萱 Lv1

跨域请求触发预检是因为你用了 POST 方法并且带有自定义头 X-Auth-Token。即使 Content-Type 是 application/json，只要带有非简单头部（如自定义头），就会触发预检。你需要确保后端配置了正确的 CORS 响应头来处理预检请求（OPTIONS）。可以试试这样修改后端，返回 204 No Content 和必要的 CORS 头：

if (request.method === 'OPTIONS') {

  response.setHeader('Access-Control-Allow-Origin', '*');

  response.setHeader('Access-Control-Allow-Methods', 'POST, GET, OPTIONS');

  response.setHeader('Access-Control-Allow-Headers', 'X-Auth-Token, Content-Type');

  response.setHeader('Access-Control-Max-Age', '86400');

  response.sendStatus(204);

}

前端代码不用变，拿去改改后端就行。

2026-03-25 09:05