Angular POST request's header is null

Question

I am developing an Ionic 3 Mobile Application, I have problem with Angular's POST method.

In login page, I created a form and tried send data to server with Angular HTTP POST method. But in server (.NET WEB API) I see request's header is null.

Here is the Angular side codes;

  login(username, password):Observable<Object>{

    let url : string = this.apiUrl+"/login";
    let headers = new HttpHeaders();

    headers.append('Authorization', btoa(username+":"+password).toString());

    return this.http.post(url,JSON.stringify({username,password}), {headers: headers});
  }

Here is the .NET side codes for controller;

[EnableCors(origins: "http://localhost:8100", headers: "*", methods: "*")]
public Response Post()
{
    return _mobileUserService.Login();
}

Here is the part of .NET side codes for catch request;

protected override Task<HttpResponseMessage> SendAsync(HttpRequestMessage request, CancellationToken cancellationToken)
        {
            try
            {
                var token = request.Headers.GetValues("Authorization").FirstOrDefault();
            }

            catch (Exception ex)
            {

            }

            return base.SendAsync(request, cancellationToken);
        }

When request catched by .NET (in running), I see these values for "request" variable;

request = {Method: POST, RequestUri: 'http://localhost:41582/api/login', Version: 1.1, Content: System.Web.Http.WebHost.HttpControllerHandler+LazyStreamContent, Headers:
{
  Connection: keep-alive
  Accept: application/json
  Accept: text/plain
  Accept: */*
  ...

In normally, request's url is localhost:8100, so I think server accepted CORS

How can I solve that?

Atul Chaudhary · Accepted Answer · 2018-01-02 04:03:04Z

1

In Web api you have to tell which method is post or get based on how you have setup your route.

[EnableCors(origins: "http://localhost:8100", headers: "*", methods: "*")]
[HttpPost] // Decorate post this attribute in your controller
public Response Post()
{
    return _mobileUserService.Login();
}

answered Jan 2, 2018 at 4:03

Atul Chaudhary

3,7321 gold badge35 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular POST request's header is null

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related