title: Angular 2 Post: Not sending 'content-type: application/json' to server
body: <p>I'm really struggling with POST-requests in Angular 2. I'm able to send a request with certain parameters, but my backend (PHP Slim v3) can't get the parameters. Therefore I investigated my request, and realized that my Angular request sends 'content-type: application/text-plain'. Therefore my backend doesn't have access to the variables. </p>
  
  <p>Then, I read many tutorials, browsed here on stack overflow and came to the conclusion that I have to append the header.</p>
  
  <p>My angular class looks like this:</p>
  
  <pre><code>/**
  * Generic method for all POST-requests.
  * 
  * @author 
  * @date 08.01.2017
  */
  postData(apiUrl, data): any
  {
  
      let headers = new Headers({ 'Content-Type': 'application/json' });
      let options = new RequestOptions({ headers: headers });
      let body = JSON.stringify(data)
  
      return this.http.post(apiUrl, body, options)
          .map((responseData) =&gt; 
          {
              if(responseData.status === 200)
              {
                  return this.extractData(responseData);
              }
              else
              {
                  this.handleRestError(null); 
              }
          })
          .catch(res =&gt; {
              return this.handleRestError(res);
         });
  }
  </code></pre>
  
  <p>So all in all pretty simple. However, when I send that request, the strange thing is, that it somehow recognizes that as an OPTIONS request and gives me 'Unsupported method: OPTIONS'.</p>
  
  <p>Please see the request header here:</p>
  
  <pre><code>OPTIONS /auth/new HTTP/1.1
  Host: localhost:8080
  Connection: keep-alive
  Pragma: no-cache
  Cache-Control: no-cache
  Access-Control-Request-Method: POST
  Origin: http://localhost:8100
  User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36
  Access-Control-Request-Headers: content-type
  Accept: */*
  Referer: http://localhost:8100/
  Accept-Encoding: gzip, deflate, sdch, br
  Accept-Language: de-DE,de;q=0.8,en-US;q=0.6,en;q=0.4
  </code></pre>
  
  <p>My response from the backend looks the following:</p>
  
  <pre><code>HTTP/1.1 200 OK
  Host: localhost:8080
  Connection: close
  X-Powered-By: PHP/5.6.28
  Set-Cookie: PHPSESSID=aa546thl9maj7hamjj64vpbe95; path=/
  Expires: Thu, 19 Nov 1981 08:52:00 GMT
  Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0
  Pragma: no-cache
  Content-type: text/plain;charset=UTF-8
  Allow: POST
  Access-Control-Allow-Methods: OPTIONS
  Content-Length: 21
  </code></pre>
  
  <p>And the response from the server looks like this:</p>
  
  <pre><code>Allowed methods: POST
  </code></pre>
  
  <p>However, I have managed to get a proper response from the server with omitting the <strong>options</strong> parameter in the post request. The request then gets sent properly and I see the desired parameters in the request payload in Chrome console. The problem is that I can't get access to the variables on backend, because it keeps giving me a 'content-type: text/plain'.</p>
  
  <p>Any idea what I'm doing wrong?</p>
  
  <p>Thanks for help in advance! </p>