Comment ajouter Access-Control-Allow-Origin dans NGINX ?

La directive traditionnelle add_header de Nginx ne fonctionne pas avec les réponses 4xx. Comme nous voulons toujours leur ajouter des en-têtes personnalisés, nous devons installer le module ngx_headers_more pour pouvoir utiliser la directive more_set_headers, qui fonctionne également avec les réponses 4xx.

sudo apt-get install nginx-extras

Ensuite, utilisez more_set_headers dans le fichier nginx.conf, j'ai collé mon exemple ci-dessous

server {
    listen 80;
    server_name example-site.com;
    root "/home/vagrant/projects/example-site/public";

    index index.html index.htm index.php;

    charset utf-8;

    more_set_headers 'Access-Control-Allow-Origin: $http_origin';
    more_set_headers 'Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE, HEAD';
    more_set_headers 'Access-Control-Allow-Credentials: true';
    more_set_headers 'Access-Control-Allow-Headers: Origin,Content-Type,Accept,Authorization';

    location / {
        if ($request_method = 'OPTIONS') {
            more_set_headers 'Access-Control-Allow-Origin: $http_origin';
            more_set_headers 'Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE, HEAD';
            more_set_headers 'Access-Control-Max-Age: 1728000';
            more_set_headers 'Access-Control-Allow-Credentials: true';
            more_set_headers 'Access-Control-Allow-Headers: Origin,Content-Type,Accept,Authorization';
            more_set_headers 'Content-Type: text/plain; charset=UTF-8';
            more_set_headers 'Content-Length: 0';
            return 204;
        }
        try_files $uri $uri/ /index.php?$query_string;
    }

    location = /favicon.ico { access_log off; log_not_found off; }
    location = /robots.txt  { access_log off; log_not_found off; }

    access_log off;
    error_log  /var/log/nginx/example-site.com-error.log error;

    sendfile off;

    client_max_body_size 100m;

    location ~ \.php$ {
        fastcgi_split_path_info ^(.+\.php)(/.+)$;
        fastcgi_pass unix:/var/run/php5-fpm.sock;
        fastcgi_index index.php;
        include fastcgi_params;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        fastcgi_intercept_errors off;
        fastcgi_buffer_size 16k;
        fastcgi_buffers 4 16k;
    }

    location ~ /\.ht {
        deny all;
    }
}

Dans mon cas, l'ajout du contrôle d'accès avec un en-tête joker n'a pas fonctionné. J'ai fini par devoir définir l'en-tête de proxy avec l'hôte de mes applications web et l'en-tête de contrôle d'accès avec l'origine définie. Voici un exemple qui a fonctionné pour moi :

location /service {
    proxy_pass http://graphql-server:8080;
    proxy_set_header Origin http://graphql-server:8080;
    proxy_hide_header Access-Control-Allow-Origin;
    add_header Access-Control-Allow-Origin "$http_origin" always;
}

Dans mon cas, en utilisant Rails 5, la seule solution qui fonctionne a été d'ajouter l'attribut rack-cors la pierre précieuse. Comme ça :

dans /Gemfile

# Gemfile
gem 'rack-cors'

dans config/initializers/cors.rb

# config/initializers/cors.rb
Rails.application.config.middleware.insert_before 0, Rack::Cors do
  allow do
    origins 'localhost:4200'
    resource '*',
      headers: :any,
      methods: %i(get post put patch delete options head)
  end
end

source : https://til.hashrocket.com/posts/4d7f12b213-Rails-5-api-and-cors