Quiero enviar una matriz de objetos dentro de formdata en React JS. Cuando agrego datos dentro de formdata, se reciben como nulos en el backend y la API me devuelve un error interno del servidor 500. Probé algunas de las soluciones de Internet, pero no encontré mucho apoyo. Las formas que he probado hasta ahora se mencionan a continuación:

 const surveyFormAnswers = [{Answer: "Hello", QuestionId: 1}, {Answer: "Document", QuestionId: 2, File: file (object)]; const data = new FormData(); data.append('SurveyFormAnswersDtos', JSON.stringify(surveyFormAnswers)); await executeAddSurveyFormAnswers({data: data});

En este caso, estoy enviando una matriz en cadena en el backend (puedo ver que mi matriz se envía dentro de la pestaña Red del navegador), pero en el backend, estamos usando dotnet core5.0. No sabemos exactamente cómo podemos deserilializar o analizar los datos de nuestra solicitud.

En el segundo enfoque, agrego mis datos manualmente dentro de los datos del formulario (obtuve este enfoque de Internet), pero esto también me envía 500 errores internos del servidor desde el backend. Mi código en este caso se ve a continuación:

 const data = new FormData(); for (var i = 0, valuePair; (valuePair = surveyFormAnswers[i]); i++) for (var j in valuePair) data.append(j, valuePair[j]); await executeAddSurveyFormAnswers({data: data});

También adjunto una captura de pantalla del cartero para que pueda verificar el formato requerido de los datos que se enviarán.

Haga clic en el enlace a continuación para ver los datos que se envían mediante cartero

He estado usando un enlace personalizado para axios y la definición de AddSurveyFormAnswers se encuentra a continuación:

 export function AddSurveyFormAnswersUrl(token) { return { url: `/SurveyAnswer/AddSurveyAnswers`, method: "POST", headers: { Authorization: `Bearer ${token}`, ContentType: "multipart/form-data; boundary=<calculated when request is sent>", }, }; }