Getting 400 from Axios Post request

May 28, 2022

I have a dotnet core webapi backend and on front end react typescript. I have one endpoint in which I create a user, but when I am submitting a response, I get 400 bad request errors on the browser console. For detail, I saw in the network tab it’s saying: errors: {Name: ["The Name field is required."]}

Here is my Axios post request:

const res = await axios.post(
            `$localhost:5000/api/User`, {
              body: {Name: "test", Username: "testuser" },
              headers: { "Content-Type": "application/json" },
          }

on back-end

public async Task<ActionResult> Post([FromBody] UserDto dto)
{

}

UserDto contains three properties one "Age" is optional two are required "Name" and "Username"

the same request use Post man is working but not working through Axios

>Solution :

As per the docs, when using the alias methods url, method, and data properties don’t need to be specified in config.

Please try

axios.post(
  `$localhost:5000/api/User`, // url
  { Name: "test", Username: "testuser" }, // data or body
  {
    headers: { "Content-Type": "application/json" } // config
  }
)