子域名配置CORS后还是跨域，到底哪里错了？

Air-建利提问于 2026-03-21 19:28:21 阅读 3

安全

我们主站是 example.com，API 服务部署在 api.example.com。我在后端设置了 Access-Control-Allow-Origin: https://example.com，但前端从 example.com 发起请求时依然报 CORS 错误，说 origin 不被允许。

试过把 credentials 设成 true，也加了 withCredentials，但没用。是不是子域名和主域名之间还有啥坑？

<script setup>
import axios from 'axios'

axios.defaults.withCredentials = true

const fetchData = async () => {
  try {
    const res = await axios.get('https://api.example.com/user')
    console.log(res.data)
  } catch (err) {
    console.error(err)
  }
}
</script>

我来解答赞 1 收藏

反馈

1 条解答

极客熙恩 Lv1

遇到这种情况，确实有点蛋疼。子域名和主域名之间默认是不共享 cookies 和 headers 的，所以即使你设置了 Access-Control-Allow-Origin，浏览器还是会因为凭证问题拒绝请求。

首先确保你的 API 服务器上正确设置了 CORS 头。你需要允许 https://example.com 并且设置 Access-Control-Allow-Credentials 为 true。代码大致如下：

header("Access-Control-Allow-Origin: https://example.com");

header("Access-Control-Allow-Credentials: true");

然后在你的前端代码里，你已经设置了 withCredentials 为 true，这部分是对的。

不过，还有一点需要注意的是，浏览器会先发送一个预检请求（OPTIONS 方法），检查是否允许真正的请求。确保你的服务器能够正确响应这个预检请求。通常你需要在服务器端添加类似以下的处理：

if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') {

    header("Access-Control-Allow-Methods: GET, POST, OPTIONS");

    header("Access-Control-Allow-Headers: Content-Type");

    exit(0);

}

如果以上都设置正确了，但问题依旧存在，可能需要检查你的服务器配置，比如 Nginx 或 Apache 的相关设置，有时候这些配置会覆盖掉 PHP 设置的头信息。

如果懒得自己搞这些配置，插件也可以，比如 WordPress 上有个叫 "CORS" 的插件，可以帮你快速设置好这些头信息，但记得检查一下插件的安全性和更新情况。

2026-03-21 20:09