宝塔面板Nginx跨域配置有四种方法：一、在网站配置文件server块中直接添加CORS响应头；二、通过location块精准控制/api/等路径跨域；三、用include方式复用独立cors.conf文件；四、将OPTIONS预检请求透传至后端处理。
如果您在使用宝塔面板部署的 Web 应用中遇到前端请求被浏览器拦截、提示“CORS 头缺少 'Access-Control-Allow-Origin'”等问题，则说明当前 Nginx 未正确配置跨域响应头。以下是针对宝塔面板中 Nginx 环境设置跨域访问的多种方法：
一、在网站配置文件中直接添加 CORS 头
该方法通过修改站点对应的 Nginx 配置文件，在 server 或 location 块内注入 Access-Control-Allow 相关响应头，适用于单一域名或明确受信源的场景。
1、登录宝塔面板，进入【网站】页面，找到目标站点，点击右侧【设置】按钮。
2、在弹出窗口中切换到【配置文件】选项卡。
3、在 server 块内（通常位于 location / { ... } 上方或内部）插入以下配置段：
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization';
add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
4、若需支持携带 Cookie 的跨域请求，需将 Access-Control-Allow-Origin 替换为具体域名（如 https://example.com），并添加：add_header 'Access-Control-Allow-Credentials' 'true';
5、点击右上角【保存】，再点击【重载配置】使 Nginx 生效。
二、通过 location 块精准控制 API 接口跨域
该方法将跨域响应头仅作用于特定路径（如 /api/ 开头的接口），避免对静态资源等非接口路径误加 CORS 头，提升安全性与规范性。
1、进入目标站点【配置文件】选项卡。
2、在 server 块末尾或合适位置新增如下 location 块：
location ^~ /api/ {
add_header 'Access-Control-Allow-Origin' 'https://trusted-site.com';
add_header 'Access-Control-Allow-Methods' 'POST, GET, OPTIONS, PUT, DELETE';
add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization, X-Requested-With';
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Max-Age' '1728000';
if ($request_method = 'OPTIONS') {
add_header 'Access-Control-Allow-Origin' 'https://trusted-site.com';
add_header 'Access-Control-Allow-Methods' 'POST, GET, OPTIONS, PUT, DELETE';
add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization, X-Requested-With';
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Max-Age' '1728000';
add_header 'Content-Type' 'text/plain; charset=utf-8';
add_header 'Content-Length' 0;
return 204;
}
try_files $uri $uri/ /index.php?$query_string;
}
3、将 https://trusted-site.com 替换为实际允许跨域的前端域名。
4、保存配置并点击【重载配置】。
三、使用 include 方式复用跨域配置
该方法将 CORS 配置抽离为独立文件，便于多个站点共用或版本管理，适合多项目维护场景。
1、通过宝塔【文件】功能，进入 /www/server/nginx/conf/ 目录。
2、新建文件，命名为 cors.conf，内容为：
add_header 'Access-Control-Allow-Origin' '$http_origin' always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always;
add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization' always;
add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range' always;
add_header 'Access-Control-Allow-Credentials' 'true' always;
3、返回目标站点【配置文件】，在 server 块内任意位置添加：include /www/server/nginx/conf/cors.conf;
4、保存配置并点击【重载配置】。
四、启用预检请求（OPTIONS）透传至后端处理
该方法不依赖 Nginx 返回预检响应，而是将 OPTIONS 请求转发给后端应用自行处理，适用于后端框架已内置 CORS 支持（如 Spring Boot、Express、Laravel）的情况。
1、进入站点【配置文件】选项卡。
2、定位到 location ~ \.php$ { ... } 或类似 PHP 处理块。
3、在该 location 块内添加判断逻辑：
if ($request_method = 'OPTIONS') {
add_header 'Access-Control-Allow-Origin' '*' always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always;
add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization' always;
add_header 'Access-Control-Allow-Credentials' 'true' always;
add_header 'Access-Control-Max-Age' 1728000 always;
add_header 'Content-Type' 'text/plain; charset=utf-8' always;
add_header 'Content-Length' 0 always;
return 204;
}
4、确保后端代码中已实现对 OPTIONS 请求的响应逻辑。
5、保存配置并点击【重载配置】。
