访问 XMLHttpRequest 已被 CORS 策略在 Node Express 和 React Axios 中阻止

Question

我在本地主机端口 5500上运行节点服务器并在本地主机端口 3000上做出反应并使用 Axios 向节点后端发出请求。 如果我使用 Axios 设置axios.defaults.withCredentials = true执行此操作，我会收到错误消息。 但是当我使用axios.defaults.withCredentials = false执行此操作时，它可以正常工作。 为什么我要更改 axios withCredentials = true因为我想从后端的请求中访问cookie。 cookie设置在前端react

错误：

CORS 策略阻止了来自源“http://localhost:3000”的“http://localhost:5500/user/auth”上的 XMLHttpRequest 访问：对预检请求的响应未通过访问控制检查：值响应中的 'Access-Control-Allow-Credentials' header 是 '' 当请求的凭据模式为 'include' 时，它必须为 'true'。 XMLHttpRequest 发起的请求的凭据模式由 withCredentials 属性控制。

我正在尝试将 origin 设置为跨中间件，但它不起作用：

app.use(cors({origin: 'http://localhost:3000'}));

中间件顺序：

app.use(cors({origin: 'http://localhost:3000'}));
app.use(express.json());
app.use(cookieParser());
app.use(express.urlencoded({ extended: false }));

Answer 1

看起来您在服务器的响应中缺少Access-Control-Allow-Credentials header。 尝试更新cors配置：

app.use(cors({
  credentials: true,
  origin: "http://localhost:3000"
}));