I am getting 422 (Unprocessable Entity)
error when I send form data form React to Mongo DB through Node.js
(it's a MERN project)
The error looks like
SignUp.jsx:24 POST http://localhost:3000/signup 422 (Unprocessable Entity)
registerData @ SignUp.jsx:24
callCallback @ react-dom.development.js:4164
invokeGuardedCallbackDev @ react-dom.development.js:4213
invokeGuardedCallback @ react-dom.development.js:4277
invokeGuardedCallbackAndCatchFirstError @ react-dom.development.js:4291
executeDispatch @ react-dom.development.js:9041
processDispatchQueueItemsInOrder @ react-dom.development.js:9073
processDispatchQueue @ react-dom.development.js:9086
dispatchEventsForPlugins @ react-dom.development.js:9097
(anonymous) @ react-dom.development.js:9288
batchedUpdates$1 @ react-dom.development.js:26140
batchedUpdates @ react-dom.development.js:3991
dispatchEventForPluginEventSystem @ react-dom.development.js:9287
dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay @ react-dom.development.js:6465
dispatchEvent @ react-dom.development.js:6457
dispatchDiscreteEvent @ react-dom.development.js:6430
Although I have tried
"proxy": {
"/signup": {
"target": "http://localhost:5000",
"secure": false
}
},
(server is running on 5000 and client is on 3000)
still not working? This is the code for sending data
const registerData = async (e) => {
e.preventDefault();
const { name, email, phone, work, password, cpassword } = user;
const response = await fetch('/signup', {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
name, email, phone, work, password, cpassword
})
});
const data = await response.json();
if (data.status === 422 || !data) {
window.alert("Invalid Registration");
console.log("Invalid Registration");
}
else {
window.alert("Registration Successful");
console.log("Registration Successful");
}
};
Click here to show full project on GitHub.
I want to successfully send form data to DB and register user then login with that credentials