Asp.Net Core FromBody parameter always null on angular PUT request

Question

I try to update the identity of a worker on my project, I use HttpClient with a put, working in Angular 6 project and web API 2 on .NET Core. You can see here the request on the front-end side:

updateWorkerIdentity(worker: WorkerRead) : Observable<WorkerRead> {
    const url = 'workerinfo/activeContractId=' + worker.activeContract.id;
    return this.httpClient.put<WorkerRead>(url , JSON.stringify(worker) ); 
}

And at the API side:

[HttpPut("{activeContractId}")]
public async Task<IActionResult> Put([FromRoute] string activeContractId, [FromBody] WorkerRead worker)
{
    var companyId = GetCompanyId();
    var period = GetPeriod();
    var language = GetLanguage();
    var workerInfo = await _workerInfoService.UpdateWorkerIdentity(companyId, activeContractId, language, worker);

    return Ok(workerInfo);
}

the activeContractId coming from the [FromRoute] is well sent but the worker is still null.

The worker sent from the body is well sent as you can see here in the payload:

and the Content-Type of the header is well application/JSON.

Anyone has an idea?

Please edit your question and paste your source code as **text**. — Rui Jarimba, Jul 21 '18 at 10:48
Your url is wrong. Query strings start withe `?` and then the name/value pairs. — Igor, Jul 21 '18 at 10:49
if I write the query like this: const url = 'workerinfo?activeContractId=' + worker.activeContract.id; it doesn't go to the api either — Loon, Jul 21 '18 at 11:17
While I am not all that familiar with angular check that you are invoking the put request correctly. Specifically the payload — Nkosi, Jul 21 '18 at 11:20
The id is well sent, it goes well to the api, so, for me that's not the issue. — Loon, Jul 21 '18 at 11:22
According to the code shown you are not sending id correctly. — Nkosi, Jul 21 '18 at 11:24
I did it as they suggested in the Angular doc: https://angular.io/guide/http#making-a-put-request — Loon, Jul 21 '18 at 11:24

Nkosi · Answer 1 · 2018-07-21T11:43:37.597

Everything on the server side looks OK for a simple endpoint.

However, based on the [HttpPut("{activeContractId}")] route template the request on the client side should be refactored to match the expected template

updateWorkerIdentity(worker: WorkerRead) : Observable<WorkerRead> {
    const url = 'workerinfo/' + worker.activeContract.id;
    return this.httpClient.put<WorkerRead>(url , worker); 
}

I suspect that the httpClient will internally stringify the payload before sending.

The above code assumes the controller is defined

[Route("[controller]")]
public class WorkerInfoController : Controller {

    //...

    //PUT workerinfo/123456
    [HttpPut("{activeContractId}")]
    public async Task<IActionResult> Put([FromRoute] string activeContractId, [FromBody] WorkerRead worker) {
        var companyId = GetCompanyId();
        var period = GetPeriod();
        var language = GetLanguage();
        var workerInfo = await _workerInfoService.UpdateWorkerIdentity(companyId, activeContractId, language, worker);

        return Ok(workerInfo);
    }    
}

Asp.Net Core FromBody parameter always null on angular PUT request

1 Answers1