0
316
VistasCómo enviar datos de formulario a través de obtener una solicitud en fetch api
Tenía una API en la que llamo a una solicitud de obtención para enviar parámetros de consulta a través de datos de formulario, pero recibo una solicitud de obtención que no toma datos de formulario. Cómo hacerlo
http://ihub-fastapi-solubility.herokuapp.com/predict?solute=CC(C)(C)Br&solvent=CC(C)(C)O esta es la URL y solute y solvent son los parámetros de consulta.
const onSubmit = (e) => { e.preventDefault(); // <-- prevent the default form action const formData = new FormData(); formData.set("solute", solutestate); // <-- local component state formData.set("solvent", solventstate); // <-- local component state console.log({ formData }); fetch("http://ihub-fastapi-solubility.herokuapp.com/predict", { method: "get", body: formData, }).catch((err) => { setError(err.error); console.log(err); }); Cuando probé con post , obtuve este error. 
1 Respuestas
Responde la pregunta0
FormData no es la mejor opción aquí, ya que se usa principalmente en la construcción de cargas útiles de solicitud multipart/form-data para usar en POST , PUT y PATCH .
Use URLSearchParams en su lugar para construir fácilmente parámetros de consulta y serializarlos en la URL...
const fetch = function fakeFetch(url, init) { console.log(init.method, url) } const solutestate = "CC(C)(C)Br" const solventstate = "CC(C)(C)O" const params = new URLSearchParams({ solute: solutestate, solvent: solventstate }) fetch(`http://ihub-fastapi-solubility.herokuapp.com/predict?${params}`, { method: "GET" }) El uso URLSearchParams tiene el beneficio adicional de codificar correctamente la URL de sus datos.