title: ReactJS cors "The 'Access-Control-Allow-Origin' header contains multiple values"
body: <p><strong>Scenario</strong></p>
  
  <p>I am using <code>fetch</code> to gather json from my remote apache server. In the beginning I was receiving the following CORS violation:</p>
  
  <blockquote>
    <p>Access to fetch at
    '<a href="http://dev.mediajackagency.com/clients/dawna/row/wordpress/wp-content/uploads/2019/01/bw.jpg" rel="nofollow noreferrer">http://dev.mediajackagency.com/clients/dawna/row/wordpress/wp-content/uploads/2019/01/bw.jpg</a>'
    from origin '<a href="http://localhost:3000" rel="nofollow noreferrer">http://localhost:3000</a>' has been blocked by CORS policy:
    Response to preflight request doesn't pass access control check: No
    'Access-Control-Allow-Origin' header is present on the requested
    resource. If an opaque response serves your needs, set the request's
    mode to 'no-cors' to fetch the resource with CORS disabled.</p>
  </blockquote>
  
  <p>I overcame this issue by enabling CORS in the server's <code>.htaccess</code> file for this project</p>
  
  <pre><code>Header always set Access-Control-Allow-Origin "*"
  Header always set Access-Control-Allow-Credentials "true"
  Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"
  Header always set Access-Control-Max-Age "1000"
  Header always set Access-Control-Allow-Headers "x-requested-with, Content-Type, origin, authorization, accept, client-security-token"
  </code></pre>
  
  <p>Now I'm getting a different CORS violation of</p>
  
  <blockquote>
    <p>Access to fetch at
    '<a href="http://some.domain/some/endpoint" rel="nofollow noreferrer">http://some.domain/some/endpoint</a>'
    from origin '<a href="http://localhost:3000" rel="nofollow noreferrer">http://localhost:3000</a>' has been blocked by CORS policy:
    Response to preflight request doesn't pass access control check: The
    'Access-Control-Allow-Origin' header contains multiple values '*,
    <a href="http://localhost:3000" rel="nofollow noreferrer">http://localhost:3000</a>', but only one is allowed. Have the server send
    the header with a valid value, or, if an opaque response serves your
    needs, set the request's mode to 'no-cors' to fetch the resource with
    CORS disabled.</p>
  </blockquote>
  
  <p><strong>Question</strong></p>
  
  <p>How can I find where the <code>Access-Control-Allow-Origin</code> is getting set for <code>localhost:3000</code> ? I've done a full index and search for strings related to cors, headers, etc etc with no luck. All ideas are appreciated.</p>
  
  <p><strong><em>Extra</em></strong></p>
  
  <ul>
  <li>Via <code>npm start</code> the second ACAO value is <code>localhost:3000</code> but via <code>npm build</code> the second ACAO value is <code>localhost</code> so the second value appears to be dynamic and restricted to React</li>
  <li>Adding a <code>proxy</code> value to <code>package.json</code> doesn't appear to help at all</li>
  </ul>