title: Fetch API cannot load ... No 'Access-Control-Allow-Origin' header
body: <p>I got</p>
  
  <ul>
  <li>a rest api deployed on heroku</li>
  <li>a react app deployed on heroku</li>
  </ul>
  
  <p>the react app tries to get data from the rest api using whatwg-fetch.</p>
  
  <pre><code>var header = {"Content-Type": "multipart/form-data", 'Origin': 'https://foo.bar', 'Access-Control-Request-Method': 'GET', 'Access-Control-Request-Headers': 'X-Requested-With'};
  var options = {method: 'GET', credentials: 'include', headers: header};
  fetch('https://myrest.api/foo', options)...
  </code></pre>
  
  <p>But I can't get any data, it say's</p>
  
  <pre><code>Fetch API cannot load https://foo.bar. 
  No 'Access-Control-Allow-Origin' header is present on the requested resource. 
  Origin 'https://foo.bar' is therefore not allowed access. 
  The response had HTTP status code 403. 
  If an opaque response serves your needs, set the request's mode to 'no-cors' 
  to fetch the resource with CORS disabled.
  </code></pre>
  
  <p>When I try to get the data with curl it works</p>
  
  <pre><code>curl -H "Origin: https://foo.bar" \
       -H "Access-Control-Request-Method: GET" \
       -H "Access-Control-Request-Headers: X-Requested-With" \
       -X GET --verbose https://myrest.api/foo -D header.txt
  </code></pre>
  
  <p>and the response header (from the curl command)</p>
  
  <pre><code>HTTP/1.1 200 
  Server: Cowboy
  Connection: keep-alive
  Access-Control-Allow-Origin: https://foo.bar
  Vary: Origin
  Access-Control-Allow-Credentials: true
  Content-Type: application/json;charset=UTF-8
  Transfer-Encoding: chunked
  Date: Fri, 09 Dec 2016 23:52:57 GMT
  Via: 1.1 vegur
  </code></pre>
  
  <p>Cors is enabled in the spring boot application via @CrossOrigin</p>
  
  <p>Thanks in advance
  Best Regards</p>