Vraag Hoe voeg ik Access-Control-Allow-Origin toe in NGINX?


Hoe stel ik de header Access-Control-Allow-Origin in zodat ik weblettertypen uit mijn subdomein op mijn hoofddomein kan gebruiken?


Opmerkingen:

U vindt voorbeelden van deze en andere headers voor de meeste HTTP-servers in de HTML5BP Server Configs-projecten https://github.com/h5bp/server-configs


133
2017-07-20 22:57


oorsprong


ah eindelijk de antwoordlocatie gevonden / {add_header Access-Control-Allow-Origin "*"; } - Chris McKee
ng4free.com/... - Jaydeep Gondaliya


antwoorden:


Nginx moet worden gecompileerd met http://wiki.nginx.org/NginxHttpHeadersModule (standaard op Ubuntu en enkele andere Linux-distro's). Dan kun je dit doen

location ~* \.(eot|ttf|woff|woff2)$ {
    add_header Access-Control-Allow-Origin *;
}

157
2017-09-01 00:25



Volg deze instructies voor het geval u dezelfde oplossing op apache wilt implementeren: stackoverflow.com/questions/11616306/... - camilo_u
Die module lijkt standaard te zijn gecompileerd (tenminste op Ubuntu). - Steve Bennett
ook standaard gecompileerd op amazon Linux Repo - Ross
In welk bestand en op welke locatie moeten we deze locatierichtlijn plaatsen? - Sumit Arora
Het werkt niet voor mij. Nginx 1.10.0, Ubuntu 16.04 - Omid Amraei


Een meer up-to-date antwoord:

#
# Wide-open CORS config for nginx
#
location / {
     if ($request_method = 'OPTIONS') {
        add_header 'Access-Control-Allow-Origin' '*';
        #
        # Om nom nom cookies
        #
        add_header 'Access-Control-Allow-Credentials' 'true';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        #
        # Custom headers and headers various browsers *should* be OK with but aren't
        #
        add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
        #
        # Tell client that this pre-flight info is valid for 20 days
        #
        add_header 'Access-Control-Max-Age' 1728000;
        add_header 'Content-Type' 'text/plain charset=UTF-8';
        add_header 'Content-Length' 0;
        return 204;
     }
     if ($request_method = 'POST') {
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Credentials' 'true';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
     }
     if ($request_method = 'GET') {
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Credentials' 'true';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
     }
}

bron: https://michielkalkman.com/snippets/nginx-cors-open-configuration.html

U kunt ook toevoegen Access-Control-Expose-Headers (in dezelfde indeling als Access-Control-Allow-Headers) om uw aangepaste en / of 'niet-eenvoudige' headers bloot te stellen aan ajax-verzoeken.

Access-Control-Expose-Headers (optional) - The XMLHttpRequest 2 object has a 
getResponseHeader() method that returns the value of a particular response 
header. During a CORS request, the getResponseHeader() method can only access 
simple response headers. Simple response headers are defined as follows:

    Cache-Control
    Content-Language
    Content-Type
    Expires
    Last-Modified
    Pragma
 If you want clients to be able to access other headers, you have to use the
 Access-Control-Expose-Headers header. The value of this header is a comma-
 delimited list of response headers you want to expose to the client.

-http://www.html5rocks.com/en/tutorials/cors/

Configs voor andere webservers http://enable-cors.org/server.html


29
2017-08-24 11:01



Elke manier om deze regels voor elke locatie niet te hoeven herhalen? Kunnen we het onder het blok server {} plaatsen? - geoyws
@geoyws (zonder @ krijg ik geen melding); je zou het boven de locatie kunnen zetten, dat is prima :) - Chris McKee
access-control-expose-headers ontbreekt hier - chovy
@chovy is een optionele header om niet-standaardaantekeningen aan ajax-verzoeken te tonen, maar ik zie dat mensen worden overladen die zo naar behoren zijn toegevoegd. Ta - Chris McKee
Gebruik alstublieft niet if in nginx - zelfs de officiële handleiding ontmoedigt het. - aggregate1166877


Allereerst wil ik zeggen dat het antwoord van @hellvinz voor mij werkt:

location ~* \.(eot|ttf|woff|woff2)$ {
    add_header Access-Control-Allow-Origin *;
}

Ik heb echter besloten om deze vraag met een ander antwoord te beantwoorden, omdat ik deze oplossing pas na ongeveer tien uur op zoek naar een oplossing kon laten werken.

Het lijkt erop dat Nginx standaard geen (juiste) lettertype-MIME-typen definieert. Door te volgen deze cursus Ik merkte dat ik het volgende kon toevoegen:

application/x-font-ttf           ttc ttf;
application/x-font-otf           otf;
application/font-woff            woff;
application/font-woff2           woff2;
application/vnd.ms-fontobject    eot;

Aan mijn etc/nginx/mime.types het dossier. Zoals gezegd werkte de bovenstaande oplossing.


6
2018-01-04 15:24



Ik zou mensen meestal willen wijzen op het mime-typebestand op H5BP github.com/h5bp/server-configs-nginx/blob/master/mime.types :) - Chris McKee


Hier is het artikel dat ik schreef dat een deel van de duplicatie voor GET | POST vermijdt. Het moet je op gang brengen met CORS in Nginx.

nginx toegangscontrole staat herkomst toe

Hier is het voorbeeldfragment van de post:

server {
  listen        80;
  server_name   api.test.com;


  location / {

    # Simple requests
    if ($request_method ~* "(GET|POST)") {
      add_header "Access-Control-Allow-Origin"  *;
    }

    # Preflighted requests
    if ($request_method = OPTIONS ) {
      add_header "Access-Control-Allow-Origin"  *;
      add_header "Access-Control-Allow-Methods" "GET, POST, OPTIONS, HEAD";
      add_header "Access-Control-Allow-Headers" "Authorization, Origin, X-Requested-With, Content-Type, Accept";
      return 200;
    }

    ....
    # Handle request
    ....
  }
}

5
2018-04-17 21:15



Volgens het SF-beleid moet u de informatie kopiëren naar het bericht, niet alleen een koppeling naar het bericht. Websites kunnen op elk moment verdwijnen, waardoor informatie verloren zou gaan. - Tim
Geldig punt @tim, bijgewerkt met de code - gansbrest


De traditionele add_header-instructie van Nginx werkt niet met 4xx-antwoorden. Omdat we nog steeds aangepaste headers aan hen willen toevoegen, moeten we de module ngx_headers_more installeren om de more_set_headers-richtlijn te kunnen gebruiken, die ook werkt met 4xx-antwoorden.

sudo apt-get install nginx-extras

Gebruik dan more_set_headers in het bestand nginx.conf heb ik mijn voorbeeld hieronder geplakt

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;
    }
}

2
2018-05-30 10:41





In mijn geval, met Rails 5, was de enige werkende oplossing het toevoegen van de rack-cors edelsteen. Zoals zo:

in / Gemfile

# Gemfile
gem 'rack-cors'

in 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

bron: https://til.hashrocket.com/posts/4d7f12b213-rails-5-api-and-cors


0
2018-05-04 23:07



hoe helpt dat nginx server statische bestanden? - Walf
Ik gebruikte nginx als een reverse proxy om de rails 5-app te bedienen. Dit is een specifiek geval waarbij de CORS-beperking niet afkomstig was van nginx maar van de oorsprong Rails-app erachter. - xyz