多個CORS標頭“Access-Control-Allow-Origin”不允許使用usginreact、symfony和docker

我正在開發一個 symfony API 并使用 Docker 做出反應。

我總是收到這個錯誤：

跨域請求被阻止：同源策略不允許在 http://localhost:8080/api/settings 讀取遠程資源。（原因：不允許使用多個 CORS 標頭“Access-Control-Allow-Origin”）。

我在本地主機上，我正在使用 nginx ：

server {
    listen 80;
    server_name 127.0.0.1;
    root /var/www/symfony/public;

    location / {
        try_files $uri /index.php$is_args$args;
    }

    location ~ ^/index\.php(/|$) {
        if ($request_method = 'OPTIONS') {
            add_header 'Access-Control-Allow-Origin' '*' always;
            add_header 'Access-Control-Allow-Methods' 'GET, POST, DELETE, OPTIONS, PATCH' always;
            add_header 'Access-Control-Allow-Headers' 'Authorization,DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range' 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;
        }
        add_header 'Access-Control-Allow-Origin' '*' always;
        add_header 'Access-Control-Allow-Methods' 'GET, POST, DELETE, OPTIONS, PATCH' always;
        add_header 'Access-Control-Allow-Headers' 'Authorization,DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range' always;
        add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range' always;
        
        fastcgi_pass php:9000;
        fastcgi_split_path_info ^(. \.php)(/.*)$;
        include fastcgi_params;
        fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
        fastcgi_param DOCUMENT_ROOT $realpath_root;
        internal;
    }
    location ~ \.php$ {
        return 404;
    }

    error_log /dev/stdout info;
    access_log /var/log/nginx/project_access.log;
}

我正在為 symfony 使用 nelmio 包：

nelmio_cors:
    defaults:
        origin_regex: true
        allow_origin: ['%env(CORS_ALLOW_ORIGIN)%']
        allow_methods: ['GET', 'OPTIONS', 'POST', 'PUT', 'PATCH', 'DELETE']
        allow_headers: ['Content-Type', 'Authorization']
        expose_headers: ['Link']
        max_age: 3600
    paths:
        '^/': null

我的前端應用程式在 http://localhost:3000/ 上運行，我總是被跨源錯誤阻止。

我用 curl 測驗過：

curl -s -D - -H "Origin: http://localhost:3000" http://localhost:8080/api/settings -o /dev/null

HTTP/1.1 200 OK
Server: nginx/1.21.6
Content-Type: application/ld json; charset=utf-8
Transfer-Encoding: chunked
Connection: keep-alive
X-Powered-By: PHP/7.4.32
Vary: Accept
X-Content-Type-Options: nosniff
X-Frame-Options: deny
Cache-Control: no-cache, private
Date: Tue, 04 Oct 2022 09:23:48 GMT
Access-Control-Allow-Origin: http://localhost:3000
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: link
Link: <http://localhost:8080/api/docs.jsonld>; rel="http://www.w3.org/ns/hydra/core#apiDocumentation"
ETag: "9568cb37ea27d38e3a052b9adee96ceb"
X-Debug-Token: 88da2c
X-Debug-Token-Link: http://localhost:8080/_profiler/88da2c
X-Robots-Tag: noindex
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, DELETE, OPTIONS, PATCH
Access-Control-Allow-Headers: Authorization,DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range
Access-Control-Expose-Headers: Content-Length,Content-Range

如何正確修復此錯誤？

uj5u.com熱心網友回復：

我通過洗掉 nginx 配置中的 add_header 'Access-Control-Allow-Origin' 解決了這個問題。我不明白為什么只允許一個 Access-Control-Allow-Origin ：

server {
    listen 80;
    server_name ${NGINX_BACKEND_DOMAIN};
    root /var/www/symfony/public;

    location / {
        try_files $uri /index.php$is_args$args;
    }

    location ~ ^/index\.php(/|$) {
        if ($request_method = 'OPTIONS') {
            add_header 'Access-Control-Allow-Origin' '*' always;
            add_header 'Access-Control-Allow-Methods' 'GET, POST, DELETE, OPTIONS, PATCH' always;
            add_header 'Access-Control-Allow-Headers' 'Authorization,DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range' 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;
        }
        add_header 'Access-Control-Allow-Origin' '*' always;  <------------------  I removed this add header
        add_header 'Access-Control-Allow-Methods' 'GET, POST, DELETE, OPTIONS, PATCH' always;
        add_header 'Access-Control-Allow-Headers' 'Authorization,DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range' always;
        add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range' always;
        
        fastcgi_pass php:9000;
        fastcgi_split_path_info ^(. \.php)(/.*)$;
        include fastcgi_params;
        fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
        fastcgi_param DOCUMENT_ROOT $realpath_root;
        internal;
    }
    location ~ \.php$ {
        return 404;
    }

    error_log /dev/stdout info;
    access_log /var/log/nginx/project_access.log;
}

標籤：反应交响乐科尔斯跨域读阻塞nelmiocorsbundle

上一篇：洗掉屬于2個物體Symfony的條目

下一篇：Symfony和ajax檢查每個復選框被選中