如何解决NGINX中Access-Control-Allow-Origin多值CORS问题

问题根源 #

你遇到的报错是因为Nginx和PHP脚本同时向响应中添加了Access-Control-Allow-Origin头，导致浏览器收到两个不同的值（*和http://localhost:3000），违反了CORS规范中该头仅能有一个值的要求。Apache环境正常是因为你在Apache的配置中没有重复添加这个头，或者Apache的处理逻辑避免了重复输出。

解决方案 #

以下是三种可行的配置方案，根据你的需求选择：

方案1：移除Nginx的CORS配置，完全由PHP处理 #

既然你确认PHP代码的CORS逻辑正常，直接删掉location ~ \.php$区块中所有add_header Access-Control-Allow-*相关配置即可。让PHP脚本单独负责输出正确的CORS响应头，避免Nginx追加重复内容。

方案2：由Nginx统一管理CORS，隐藏PHP返回的重复头 #

如果希望用Nginx统一控制CORS规则，需要先隐藏PHP输出的Access-Control-Allow-Origin头，再由Nginx添加正确的配置：

location ~ \.php$ {
    # 保留你原有的FastCGI配置
    fastcgi_pass unix:/run/php/php7.4-fpm.sock; # 根据你的PHP-FPM路径调整
    fastcgi_index index.php;
    include fastcgi_params;

    # 隐藏PHP脚本返回的Access-Control-Allow-Origin头
    fastcgi_hide_header Access-Control-Allow-Origin;

    # 添加Nginx的CORS规则
    add_header Access-Control-Allow-Origin http://localhost:3000 always;
    add_header Access-Control-Allow-Methods "GET, POST, OPTIONS, PUT, DELETE" always;
    add_header Access-Control-Allow-Headers "Content-Type, Authorization" always;

    # 处理OPTIONS预检请求，直接返回204状态码
    if ($request_method = OPTIONS) {
        return 204;
    }
}

• 注意always参数：确保在非200状态码（比如404、500）的响应中也能输出CORS头，避免预检请求或错误请求触发CORS报错。

方案3：动态匹配允许的Origin（多域名场景） #

如果需要允许多个前端域名访问，不要同时设置*和具体域名，而是用Nginx变量动态匹配请求来源：

location ~ \.php$ {
    # 原有的FastCGI配置
    fastcgi_pass unix:/run/php/php7.4-fpm.sock;
    fastcgi_index index.php;
    include fastcgi_params;

    fastcgi_hide_header Access-Control-Allow-Origin;

    # 定义允许的域名列表，可按需添加
    set $allowed_origin "";
    if ($http_origin ~* "^http://localhost:3000$") {
        set $allowed_origin $http_origin;
    }
    if ($http_origin ~* "^https://your-production-site.com$") {
        set $allowed_origin $http_origin;
    }

    # 仅当匹配到允许的域名时添加头，如需允许所有域名可设置为$allowed_origin = "*"
    add_header Access-Control-Allow-Origin $allowed_origin always;
    add_header Access-Control-Allow-Methods "GET, POST, OPTIONS, PUT, DELETE" always;
    add_header Access-Control-Allow-Headers "Content-Type, Authorization" always;

    if ($request_method = OPTIONS) {
        return 204;
    }
}

验证配置 #

修改Nginx配置后，执行以下命令重启服务生效：

sudo nginx -t # 先验证配置语法是否正确
sudo systemctl restart nginx # 重启Nginx服务

可以用浏览器开发者工具的网络面板查看响应头，确认Access-Control-Allow-Origin仅存在一个正确的值。

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