0

resulta que estoy realizando un formulario que obtiene los datos del usuario y los almacena en la base de datos a través de un método post pero al momento de llamar la api del fetch me retorna un error como si no estuviera recibiendo los datos del body que se deben colocar

Acá muestra el error en la consola

Acá me lanza el mensaje que creé en la instanciación de la tabla

ya traté de convertir la clase que viene del front end a JSON.stringify pero aún así no me funciona, agradecería su ayuda ya que me encuentro atascado y no he podido almacenar los datos

esta es mi Api:

const url = `${basePath}/${apiVersion}/post-contact`;
const params = {
    method: "POST",
    body: JSON.stringify(data)
}
console.log(params.body);

return fetch(url, params).then(response => {
    return response.json();
}).then(result => {
    return result
}).catch(err => {
    return err
})

acá la llamo en el front end

const {name, email, lastName, phone, reason} = inputs;
    // eslint-disable-next-line no-useless-escape
    const emailValid = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    const resultValidation = emailValid.test(email);
    
    if(!email || !name || !lastName || !phone || !reason){
        notification["warning"]({
            message: "Todos los campos son obligatorios."
        })
        
    }
    else{
        if(!resultValidation){
            notification["warning"]({
                message: "Verifique el correo."
            })
        }else{
            contactApi(inputs)
        }
    }

como pueden ver hice un console.log de la data que recibe la api y me la retorn como un Json (en la imágen aparece como si fuera una clase pero esa imágen la tomé antes), cómo información adicional la data que estoy tomando del front end se está guardando en un useState. Si yo tomo los datos que aparecen en la consola y los pego en postman por el body, me registra exitosamente los datos pero en el api o en el front end no se guardan bien, ayuda!!!

Este es el código del controller

    const Contact = require('../models/contact');


function getContact(req, res){

    const contact = new Contact();
    const {name, lastName, email, phone, reason} = req.body;

    contact.name = name;
    contact.lastName = lastName;
    contact.email = email;
    contact.phone = phone;
    contact.reason = reason;

    
        contact.save((err, contacStored) => {
            if(err){
                res.status(500).send({code: 500, message: "El correo ya está en la base de datos."})
            }else{
                res.status(200).send({code: 200, message: "Se ha registrado correctamente, en breves nos comunicaremos con usted."})
            }
        })
    
    
}

module.exports = {
    getContact
}

este es el de la ruta

   const express = require('express');
const Contact = require('../controllers/contact');

const api = express.Router();

api.post("/post-contact", Contact.getContact);

module.exports = api;
5
  • Estas seguro de que tu back-end esta corriendo? No esta encontrando la ruta. Podrías mostrarnos el código del endpoint en el back-end?
    – Ale
    Commented el 13 feb. 2021 a las 1:48
  • Sí, está corriendo, ya comprobé con postman enviando un JSON y sí lo guarda
    – Hidenplus
    Commented el 13 feb. 2021 a las 1:50
  • Ya coloqué el código del controlador y de la ruta
    – Hidenplus
    Commented el 13 feb. 2021 a las 1:56
  • en qué parte defines data?
    – ffflabs
    Commented el 13 feb. 2021 a las 4:49
  • Es un useState que empieza con un objeto con name, lastName, email, phone y reason vacíos y los defino con un onChange en el form
    – Hidenplus
    Commented el 13 feb. 2021 a las 13:50

1 respuesta 1

-2

A mi me ha funcionado de la siguiente manera:

const params = {
    method: "POST",
    body: new URLSearchParams({
       data: 'tu data'
    })
}
1
  • 2
    Podrías editar tu respuesta y agregar por que este código soluciona el problema por favor? Así aumentarás su calidad, será mejor recibida y tanto el autor de la pregunta como quienes vean tu respuesta más adelante podrían aprender algo nuevo.
    – Dante S.
    Commented el 9 feb. 2022 a las 1:25

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.