How send simple value from axios.post to asp.net core?

Question

Using axios.post for send a simple value int to my controller on asp.net core, when send any value ever the method controller receive value "0".

Which is the correct way for send this type of value using axios (post or delete)?

PD: i can send correctly models and receive on controller with [FromBody]

Method controller:

[Route("Delete"),HttpPost]
public async Task<ActionResult> Delete(int id)
    {
        try{
             var result = await userService.DeleteUserPerson(id);
             return Json(new{
                response=true,
                data=result,
                error=""
                });
        }
        catch(Exception ex){
            return Json(new{
                response=false,
                data=false,
                error=ex.Message
                });
        }
    }

Method from react class:

async function DeleteUser(id, props){
var request= new Request({});
try{
    console.log(id);
    var axiosResp= await request.axios_request.post('User/Delete', JSON.stringify({id:id}));
    if(axiosResp.status!=200){
        //do smething
    }

    //this case validate error
    if(axiosResp.data.response && !axiosResp.data.error){
        //do something
    }

    //do something
}catch(err){
   //do something
}
}

Class request (axios):

export default class Request {
constructor(){
    this.axios_request = axios.create({
        baseURL: 'http://localhost:5000/api',
        timeout: 5000,
        headers: authHeader()
    });
}

}

Solution 1

Testing diferents ways, this work for me:

 [Route("Delete/{id}"),HttpDelete("{id}")]
public async Task<ActionResult> Delete([FromRoute]int id){}

On axios use delete:

request.axios_request.post('User/Delete/'+ id);

Solution 2

It looks like you are trying to do two different things at once. So you can either specify the id in route or in the body of the HTTP request. If it is in the route the url which should be called is "User/Delete/{id}". In that case you should specify [FromRoute] before the id parameter of the function "Delete". like this (I would recommend using the HTTP delete for this: you can read about using delete with axios here: Axios Delete request with body and headers?):

[Route("Delete")]
[HttpDelete]
public async Task<ActionResult> Delete([FromRoute] int id) 

If you want to specify the id in the body you should do, as you mention yourself, use the [FromBody] like this:

[Route("Delete")]
[HttpPost]
public async Task<ActionResult> Delete([FromBody] int id) 

If you want to delete a model then I would suggest actually using the HTTP method delete instead. You should then use the decorator [HttpDelete] instead of [HttpPost] as shown above.

Edit: Furthermore I can see that you are sending an object containing the parameter id to the controller. Try either just sending the number or change the parameter of the function to an object containing the id to match what you are sending in your axios call.

This means changing this line:

var axiosResp= await request.axios_request.post('User/Delete', JSON.stringify({id:id}));

to:

var axiosResp= await request.axios_request.post('User/Delete', id);

Comments

[Dr oscar]

This way not work, why ?: [Route("Delete"),HttpDelete("{id}")] public async Task<ActionResult> Delete([FromRoute] int id) {} .......... var axiosResp= await request.axios_request.delete('User/Delete', {id:id})

[kasperlauge]

You are still sending an object in your axios request. Should be axious.delete(‘User/Delete/:id’)

[Dr oscar]

Not work the way: request.axios_request.delete('User/Delete/:id'); because obtain error: http://localhost:5000/api/User/Delete/:id 404 (Not Found)

[kasperlauge]

You should replace the :id with the actual id so like: User/Delete/123 in the axios request

[Dr oscar]

can use too : request.axios_request.delete('User/Delete/'+ id);