omkar yadav
omkar yadav

Reputation: 177

400(Bad request) status code when making request with axios in reactjs

errorIt's working when making a request with postman for when trying to with axios in reactjs its showing 400 status code

I have already tried - adding removing headers - adding boundary:--foo

handleSubmit(event) {
let data = new FormData();
      data.append("username", this.state.username)
      data.append("password", this.state.password)
      data.append("confirm_password", this.state.confirm_password)
      data.append("email", this.state.email)
      event.preventDefault();
      axios({
         method: 'post',
         url: 'http://localhost:8000/api/account/register/',
         data: data,
      headers:{
         "Content-Type":"application/x-www-form-urlencoded; boundary:XXboundaryXX"
      }
      })
         .then((response) => {
             console.log('bitchhh');

         })
         .catch((response) => {
            //handle error
            console.log(response);
         });
   }

chrome[error code[![postman]3

Upvotes: 0

Views: 2173

Answers (1)

Nafees Anwar
Nafees Anwar

Reputation: 6598

If there are any errors in data, rest framework does not return 2xx status codes it always returns 400 bad request. It means there are errors in request you sent.

Postman is also receiving 400 bad request but it is showing response data (error messages).

axios treats 400 status code as error so you would have to handle it in catch block. If you want to access response sent with errors you can access it from

.catch((err) => {
    //handle error
    console.log(err.response.data);
 });

Upvotes: 5

Related Questions