title: Angular2 Post application/json
body: <p>I receive a 405 error when I attempt to POST application/json using Angular2. I know its not a CORS issue because all of the server response headers are in place (Access-Control-Allow-Headers,Access-Control-Allow-Methods,Access-Control-Allow-Origin) and I can do a POST when the content type is application/x-www-form-urlencoded. </p>
  
  <p>Is there a known issue with trying to POST application/json with Angular2?</p>
  
  <p>The server side code is written in C# using MS Web API with IIS server.</p>
  
  <p>Request Info:</p>
  
  <pre><code>Request URL:http://localhost:9090/api/Authentication/login
  Request Method:OPTIONS
  Status Code:405 Method Not Allowed
  Remote Address:[::1]:9090
  Response Headers
  view source
  Access-Control-Allow-Headers:Content-Type
  Access-Control-Allow-Methods:GET, POST, PUT, DELETE, OPTIONS
  Access-Control-Allow-Origin:*
  Allow:POST
  Cache-Control:no-cache
  Content-Length:76
  Content-Type:application/json; charset=utf-8
  Date:Fri, 18 Mar 2016 14:27:27 GMT
  Expires:-1
  Pragma:no-cache
  Server:Microsoft-IIS/7.5
  X-AspNet-Version:4.0.30319
  X-Powered-By:ASP.NET
  Request Headers
  view source
  Accept:*/*
  Accept-Encoding:gzip, deflate, sdch
  Accept-Language:en-US,en;q=0.8
  Access-Control-Request-Headers:content-type
  Access-Control-Request-Method:POST
  Connection:keep-alive
  Host:localhost:9090
  Origin:http://localhost:3000
  Referer:http://localhost:3000/login
  User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.87 Safari/537.36
  </code></pre>
  
  <p>Code:</p>
  
  <pre><code>import { Component, View } from 'angular2/core';
  import { Router, RouterLink } from 'angular2/router';
  import { CORE_DIRECTIVES, FORM_DIRECTIVES } from 'angular2/common';
  import { Http, Headers, RequestOptions} from 'angular2/http'; 
  
  @Component({
      selector: 'login'
  })
  @View({
      directives: [RouterLink, CORE_DIRECTIVES, FORM_DIRECTIVES],
      templateUrl: 'app/login/login.html',
      styles: ['app/login/login.css']
  })
  export class Login {
      constructor(public router: Router, public http: Http) {
      }
  
      login(event, username, password) {
          event.preventDefault();
          let body = JSON.stringify({ userName: "user", password: "pwd", apiKey: "key", role: "role" });
          let headers = new Headers({ 'content-type': 'application/json' });
          let options = new RequestOptions({ headers: headers });
          this.http.post('http://localhost:9090/api/Authentication/login', body, options)
              .subscribe(
                  response =&gt; {
                      localStorage.setItem('jwt', response.json().id_token);
                      this.router.parent.navigateByUrl('/home');
                  },
                  error =&gt; {
                      alert(error.text());
                      console.log(error.text());
                  }
              );
      }
  
      signup(event) {
          event.preventDefault();
          this.router.parent.navigateByUrl('/signup');
      }
  }
  </code></pre>