CORS是浏览器限制跨源请求的安全机制，需服务器返回Access-Control-Allow-Origin等响应头授权；常见报错提示请求被拦截，实为响应头缺失；配置时需注意Credentials与*互斥、预检请求处理等细节。
CORS（跨域资源共享）是浏览器的一种安全机制，用来限制网页脚本向不同源（协议、域名、端口任一不同）的服务器发起请求。它不是JavaScript本身的特性，而是浏览器对JS发起的HTTP请求施加的限制。简单说：你的JS代码想用fetch或XMLHttpRequest访问另一个域名的API，浏览器会先检查对方服务器是否“同意”，这个“同意”就是靠CORS响应头控制的。
典型提示如：
“Access to fetch at 'https://api.example.com/data' from origin 'http://localhost:3000' has been blocked by CORS policy…”
这说明请求发出去了，但浏览器在收到响应后发现缺少合法的CORS头，直接拦截了响应内容——注意：服务端其实可能已成功处理请求，只是前端拿不到结果。
最基础的配置只需两个响应头：
Access-Control-Allow-Origin：指定允许哪个源访问，比如http://localhost:3000，或用*（仅限无认证请求）Access-Control-Allow-Methods：列出允许的HTTP方法，如GET, POST, PUT, DELETE
如果请求带Cookie或Authorization头，还需额外设置：
Access-Control-Allow-Credentials: true（此时Allow-Origin不能为*，必须写具体域名）Access-Control-Allow-Headers：如Content-Type, Authorization
Node.js（Express）示例：
立即学习“Java免费学习笔记（深入）”；
塔可商城, 一个基于springboot+uniapp+vue3技术栈开发的开源跨平台小程序、管理后台，后端服务的项目，它内置提供了会员分销， 区域代理， 商品零售等功能的新零售电商系统。强大弹性的架构设计，简洁的代码，最新的技术栈，全方面适合不同需求的前端，后端，架构的同学，同时更是企业开发需求的不二选择。 项目结构通过项目结构，你将清楚明白你即将入手的是一个怎么样的项目，你可能需要什么，如何
0
app.use((req, res, next) => {
res.header('Access-Control-Allow-Origin', 'http://localhost:3000');
res.header('Access-Control-Allow-Credentials', true);
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization');
next();
});Nginx配置片段：
location /api/ {
add_header 'Access-Control-Allow-Origin' 'http://localhost:3000';
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE';
add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization';
if ($request_method = 'OPTIONS') {
add_header 'Access-Control-Max-Age' 1728000;
add_header 'Access-Control-Allow-Origin' 'http://localhost:3000';
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE';
add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization';
add_header 'Content-Type' 'text/plain; charset=utf-8';
add_header 'Content-Length' 0;
return 204;
}
}Python（Flask）简写方式：
from flask_cors import CORS CORS(app, origins=['http://localhost:3000'], supports_credentials=True)
*配Allow-Origin + Allow-Credentials，会报错基本上就这些。CORS本身不复杂，但细节容易忽略，重点盯住那几个响应头是否匹配你的前端请求方式。
以上就是JavaScript CORS是什么_如何配置服务器？的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
147
收藏
