同域下发送GET请求遇CORS预检错误，求解决方案

嘿，我来帮你理清楚这个问题——你现在踩了一个CORS新手常犯的坑：那些Access-Control-*头是服务器要返回给浏览器的，不是前端请求要带上的！

为什么会出现这个错误？ #

你看到的"preflight request"是浏览器自动发起的OPTIONS请求，用来提前确认服务器是否允许跨域请求。如果服务器没有在OPTIONS响应中返回Access-Control-Allow-Origin这类允许头，浏览器就会拦截后续的GET请求，抛出你看到的错误。

具体修复步骤 #

1. 删掉前端代码里多余的CORS头 #

你的前端代码完全不需要设置任何Access-Control-*头，浏览器根本不会把这些头发送给服务器。修正后的代码应该是这样：

// 去掉多余的ajaxSetup配置，直接发起请求
$.get(myurl, function(data) {
  console.log(data);
});

2. 在服务器端配置CORS允许头 #

这是解决问题的核心，根据你的后端技术栈选择对应的配置方式：

• Node.js/Express：用cors中间件最省心

  const express = require('express');
  const cors = require('cors');
  const app = express();
  
  // 开发环境可临时允许所有域名，生产环境建议指定具体前端域名
  app.use(cors());
  
  // 更安全的配置：只允许你的前端域名跨域
  // app.use(cors({ origin: 'http://localhost:你的前端端口号' }));
  

• PHP：在接口最顶部添加响应头

  // 允许所有域名，或替换为你的前端具体域名
  header("Access-Control-Allow-Origin: *");
  header("Access-Control-Allow-Methods: GET, POST, OPTIONS");
  header("Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token");
  
  // 处理浏览器自动发起的OPTIONS预检请求
  if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') {
      exit(0);
  }
  

• 其他后端（Java/.NET等）：找到响应头配置入口，添加对应的Access-Control-*头，务必确保OPTIONS请求能得到正确响应。

3. 如果无法修改服务器（比如调用第三方API） #

可以用本地代理绕过CORS限制：

• 开发时用Webpack Dev Server的proxy配置，把请求转发到目标服务器
• 或者用Nginx做反向代理，让浏览器误以为请求是同域的

补充小知识点 #

• CORS是浏览器专属的安全机制，Postman这类接口测试工具不会拦截跨域请求
• 哪怕都是localhost，只要端口不同（比如前端跑3000，服务器跑8080），也属于跨域，需要配置CORS

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