Getting ‘422 Unprocessable Entity’ trying to post a list of files to a FastAPI route.
Python:
@app.post("/upload-images/")
async def images(images: List[UploadFile] = File(...)):
for image in images:
print(image.filename)
Javascript:
async function handleUpload() {
if (files.length > 0) {
const formData = new FormData();
Array.from(files).forEach((f) => {
formData.append("images[]", f);
});
console.log(formData.getAll("images[]")); //can see the images appended properly
const imageUploadResponse = await axios
.post("/upload-images/", formData, {
headers: {
"Content-Type": "multipart/form-data",
},
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
// toast.error("Woops. Image upload failed.");
});
}
}
I’ve also tried just appending the array with no luck:
formData.append("images", files);
Can someone please let me know what I am doing wrong?