Django: Bad request when sending request using reactJS

Question

I am using django-rest-framework at backend and I am trying to post following data from react frontend.

handleSubmit() {
   fetch('http://127.0.0.1:8000/api/debt/create',{
       method: 'POST',
       headers: {
           Authorization: `Bearer ${localStorage.getItem('id_token')}`,
           'Content-Type': 'application/json'
       },
       body: JSON.stringify({
           user: '1',
           customer: '9',
           debtKey: 'b1d9ef1b-45ad-4dc5-80cc-95f7994c0aae',
           createduserKey: '0245abb9-2837-4f37-ae02-9be1b88887ef',
           totalDebt: 789,
           receivedAmount: 115,
           description: 'Debt description',
           paymentDate: '01.01.2019'
       }),
   }).then(response => {
       console.log(response);
       return response.json()
   }).then(json => {
       //this.setState({
       //    user:json
       //});
   });
 console.log("Form Sumbmssion");
}

But I am getting "BAD REQUEST" error. What I am missing? Thanks

A bad request means the data you are sending from React to Django is not what Django expects. Try to log any validation errors in Django to see which post data is missing or incorrect. It could be something as simple as a missing field or invalid data. You need to post your Django view and possibly models to work it out. — Dean Elliott
– Dean Elliott, Commented Mar 30, 2021 at 8:56

Hardeep Chhabra · Accepted Answer · 2021-03-30 09:27:42Z

2

I think you just need to add "/" to http://127.0.0.1:8000/api/debt/create at the end. Bad request is often due to that issue only. But why are you using fetch anyway. Please consider using axios if you are using React.js on the frontend. It is identical to fetchAPI, but is lot more flexible.

answered Mar 30, 2021 at 9:27

Hardeep Chhabra

852 bronze badges

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

Comments

MadMax · Accepted Answer · 2021-03-30 11:00:50Z

1

Authorization is a key .it should be in quotes.

headers: {
       'Authorization': `Bearer ${localStorage.getItem('id_token')}`,
       'Content-Type': 'application/json'
   },

answered Mar 30, 2021 at 11:00

MadMax

634 bronze badges

Collectives™ on Stack Overflow

Django: Bad request when sending request using reactJS

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related