title: Cross-Origin Request Blocked for missing CORS header ‘Access-Control-Allow-Headers’
body: <p>I have a UI running locally where I call the remote resource <code>arg.kl.com</code>. I hosted the UI on an nginx container with the configuration below. But still I am getting the warning above in the browser console. Not sure what is wrong in this config.</p>
  
  <pre><code>server {
  listen 80;
  server_name localhost;
  
  add_header 'Access-Control-Allow-Origin' $http_origin;
  add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
  
  location / {
      root   /usr/share/nginx/html;
      index  index.html index.htm;
      add_header 'Access-Control-Allow-Origin' $http_origin;
      add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
  }
  
  location /folders/ {
  
      proxy_set_header X-Forwarded-Host $host;
      proxy_set_header X-Forwarded-Server $host;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      add_header 'Access-Control-Allow-Origin' $http_origin;
      proxy_set_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
      proxy_pass arg.kl.com;
  }
  </code></pre>
  
  <p>}</p>
  
  <p>I am seeing the following error in console:</p>
  
  <blockquote>
    <p>Cross-Origin Request Blocked: The Same Origin Policy disallows reading
    the remote resource at
    <a href="http://arg.kl.com:4010/layouts/MV672Scse0-8663-40d8-876d-f.mvhtml" rel="nofollow noreferrer">http://arg.kl.com:4010/layouts/MV672Scse0-8663-40d8-876d-f.mvhtml</a>.
    (Reason: missing token ‘access-control-allow-headers’ in CORS header
    ‘Access-Control-Allow-Headers’ from CORS preflight channel).</p>
  </blockquote>
  
  <p>What is wrong here?</p>