title: Ajax is not setting the headers - React with TS
body: <p>I am using React With Redux and I wrote a middleware that comes in handy when I do Ajax calls in Epics. For example, to do a <code>GET</code> request, I have this <code>getJSON</code> function.</p>
  
  <pre><code>import {ajax, AjaxResponse} from "rxjs/ajax";
  
  const getJSON = (url: string, headers?: Object): Observable&lt;AjaxResponse&gt; =&gt;
      ajax({
          method: "GET",
          url,
          responseType: "json",
          headers,
          withCredentials: true
      });
  </code></pre>
  
  <p>Everything seem to work fine except that <code>Ajax</code> does not set the headers that contains the access token.</p>
  
  <p>When I step through the code, the <code>headers</code> object looks like this,</p>
  
  <pre><code>{
      Authorization: "Bearer ey-SOME-ACCESS-TOKEN"
  }
  </code></pre>
  
  <p>As expected... But when I look through the network calls, it does not contain the specified header with its value.</p>
  
  <p>Parsed:</p>
  
  <pre><code>Accept: */*
  Accept-Encoding: gzip, deflate, br
  Accept-Language: en-US,en;q=0.9
  Access-Control-Request-Headers: authorization
  Access-Control-Request-Method: GET
  Connection: keep-alive
  Host: localhost:1337
  Origin: http://localhost:3000
  </code></pre>
  
  <p>Source:</p>
  
  <pre><code>OPTIONS /api/test HTTP/1.1
  Host: localhost:1337
  Connection: keep-alive
  Access-Control-Request-Method: GET
  Origin: http://localhost:3000
  User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36
  Access-Control-Request-Headers: authorization
  Accept: */*
  Accept-Encoding: gzip, deflate, br
  Accept-Language: en-US,en;q=0.9
  </code></pre>
  
  <p>NOTE: Please don't mark this as duplicate. I know there are similar questions on SO, but none of them seem to work for me.</p>
  
  <hr>
  
  <p>After 3 days of pulling my hairs and banging my head on the walls, I finally figure out what is the problem, but still not sure why/how. Apparently due to <code>CORS</code>, there is always <code>OPTION</code> request is made before the actual <code>POST</code> or <code>GET</code> request. Which I already knew and kinda make sense. What does not make sense to me is why the heck it does not contain the headers. If anyone can explain this to me will be eligible for the bounty on this question.</p>
  
  <p>I had to made changes in my back-end to handle <code>OPTION</code> requests, and it seems to work for now. I can't spend more time of this.</p>