"The requested resource does not support http method 'POST'

Question

i M doing post request from angular 2 with asp.net webapi 2 when i m running my app. it giving me above error message i checked its response in fiddler as

<>

i search on google for the solution and made changes according to suggestion but still i m facing the same error. Asp.net web api code is:-

public void postvalidUser(string UserName,string Password)
    {
        try
        {
            var login = uData.Users.Where(x => x.UserName == UserName).ToList();
            if (login != null && login.Count > 0)
            {
                foreach (var log in login)
                {
                    if (log.UserName == UserName && log.Password == Password)
                    {
                        Console.WriteLine("login ok");

                    }

                }
            }
            else
            {
               Console.WriteLine("login fail");

            }

        }

        catch (Exception ex){

            Console.WriteLine(ex);
        }

    }

login.servuce.ts code

@Injectable()
export class LoginService {

  constructor(private _http: Http) { }
  postvalidUser(UserName: string, Password: string) {
    const users = { UserName: UserName, Password: Password };
    let body = JSON.stringify(users);
    let headers = new Headers({ 'Content-Type': 'application/json' });
    let options = new RequestOptions({headers: headers });

    return this._http
      .post("http://localhost:65440/api/User", users, options)
      .map(result => result.json());
  }

  }

login.component.ts

export class LoginComponent implements OnInit {

  constructor(private _loginservices: LoginService) {  }

  ngOnInit() {
  }
  OnClick(UserName: string, Password:string) {
    this._loginservices.postvalidUser(UserName, Password)
         .subscribe(users => console.log(users));

  }

login.component.html

  <div>
  <table>
    <tr>
      <td>UserName</td><td><input [(ngModel)]="UserName" /></td>
    </tr>
    <tr><td>Password</td><td><input [(ngModel)]="Password" /></td>
    </tr>
    <tr>
      <td></td><td><button class="btn btn-primary" (click)="OnClick(UserName.value,Password.value)">Submit</button></td>
    </tr>
  </table>

</div>

Please correct me if i have some error in my code

Your code isn't the error, you have to add the POST method to the list of allowed methods — user4676340

Wesley Coetzee Wesley Coetzee · Accepted Answer · 2018-01-16T07:46:30

Your issue is with your API. You are missing the HttpPost verb and also your method needs a return type instead of void. You also need a model to accept your values

public class User 
{
    public string UserName {get; set;}
    public string Password {get; set;}
}

Then use that model inside the your controller

[HttpPost]
public IHttpActionResult postvalidUser(model User)
{
    //Do whatever needs to be done.
    //if log in is successful then return Ok()        
    return Ok();
    //if log in is NOT successful then return BadRequest()
}

Your service will look like this

postvalidUser(UserName: string, Password: string) {
    let users = { UserName: UserName, Password: Password };

    return this._http
      .post("http://localhost:65440/api/user", users)
}

component

OnClick(UserName: string, Password:string) {
    this._loginservices.postvalidUser(UserName, Password)
         .subscribe(users => console.log(users),
                    error => {
                        //check the error code here, if it 400 then log in information supplied was incorrect 
                    });

}

The headers are not needed, nor is the JSON.Stringify.

"The requested resource does not support http method 'POST'

1 Answers