Problemas
axios.post con formData siempre devuelve un objeto vacío {}
código de la aplicación reaccionar
const UserSignup = () => { const signupUser = async (event) => { try { event.preventDefault(); const formData = new FormData(document.getElementById('signupForm')); const res = await axios.post( `${process.env.REACT_APP_BACKEND}/users/signup`, formData ); console.log(res.data); } catch (error) { console.log(error); } }; return ( <Container> <h1>signup form</h1> <form onSubmit={signupUser} id="signupForm"> email : <HTextInput name="email" /> password : <HTextInput name="password" type="password" /> passwordCheck : <HTextInput name="passwordCheck" type="password" /> <Button type="submit">signup</Button> </form> </Container> ); };Lo comprobé..
sí. Verifiqué valores-clave agregando algunos códigos como
... const formData = new FormData(document.getElementById('signupForm')); // FormData key for (let key of formData.keys()) { console.log(key); } // FormData value for (let value of formData.values()) { console.log(value); } const res = await axios.post( `${process.env.REACT_APP_BACKEND}/users/signup`, formData ); ...valores-clave impresos en la consola del navegador
sí. Lo chequé con el cartero y funciona perfectamente
captura de pantalla del cartero
respuesta de backend (console.log (cuerpo))
espero ayuda gracias
Intente agregar {headers: { "Content-Type": "multipart/form-data" }} como tercer argumento a su llamada axios.post() .
Hay muchos tipos de cuerpos como form-data , x-www-form-urlencoded ..
encontre eso
form-data vacío {}pero
x-www-form-urlencoded devolver lo que esperaba como { email : "aa@google.com "}el problema era la forma de recibir formdata en backend (Nest.js)
Agrego código en nest.js como
... @Post() @UseInterceptors(FileInterceptor('file')) // <-- this createUser(@Body body: any) { ... funciona bien, esperaba si el tipo de contenido es predeterminado ( x-www-form-urlendcoed ) o multipart/form-data en la aplicación React
No puedo explicar exactamente por qué sucedió esto y el trabajo.
¿Alguien puede explicar por qué?