Hello, I am making an application using Strapi and I want to load a video from the input type File option. Everything goes well until I send the POST request and when I see what it loads in media I get Null.
Este es el codigo del input tipo file:
<div className="mb-4">
<label
className="text-gray-800"
htmlFor="media"
>Video:</label>
<input
id="media"
type="file"
className="mt-2 block w-full p-3 bg-gray-50"
placeholder="Seleccione el video"
name="media"
defaultValue={contenido?.media}
/>
</div>
este es el formulario donde tengo el metodo y el input que envia el submit.
<Form method="post" encType="multipart/form-data">
<FormularioCapacitacion />
<input
type="submit"
className="mt-5 w-full bg-green-800 p-3 uppercase font-bold text-white text-lg"
value="Registrar Capacitación"
/>
</Form>
En esta parte valido los datos y envio los datos a la funcion del server que hace la peticion a la API.
export async function action({ request }) {
const formData = await request.formData();
const data = Object.fromEntries(formData);
const dataFinal = {data}
console.log(dataFinal);
console.log(data);
//Validación
const errores = [];
if (Object.values(data).includes("")) {
errores.push("Todos los campos son obligatorios");
}
//Retornar datos si hay errores
if (Object.keys(errores).length) {
return errores;
}
await agregarCapacitaciones(dataFinal);
return redirect("/capacitaciones");
}
y por ultimo el siguiente codigo hace el post.
export async function agregarCapacitaciones(datos){
console.log(datos);
try {
const respuesta = await fetch(import.meta.env.VITE_API_STRAPI_CONTENIDOS_URL, {
method: 'POST',
body: JSON.stringify(datos),
headers: {
'Content-Type': 'application/json'
}
})
await respuesta.json()
} catch (error) {
console.log(error);
}
}