When trying to upload two files, the response does not come back continuously. I wonder what needs to be changed. Uploading one file works fine.
The following code is an example.
One variable 'img' (files.img[0]) uploads successfully,
but when creating two variables 'img' and 'img2' for uploading,
the upload does not work.
Changing the name in imgForm.append doesn't seem to work either.
// Home.tsx
<input
type="file"
accept="image/*"
multiple={true}
{...register("images")}
/>
// pages/api/cloudflare/upload.ts
const imgForm = new FormData();
const twoArray = new Array(2).fill(0).map((el, idx) => el + idx);
if (fields.title && files.img) {
const title = fields.title[0];
const img = files.img[0];
const img2 = files.img[1];
const fileData = await fs.promises.readFile(img.filepath);
const fileData2 = await fs.promises.readFile(img2.filepath);
const blob = new Blob([fileData], { type: img.mimetype! });
const blob2 = new Blob([fileData2], { type: img2.mimetype! });
const file = new File([blob], title, {
type: img.mimetype!,
});
const file2 = new File([blob2], title + "앞", {
type: img2.mimetype!,
});
imgForm.append("file", file);
imgForm.append("file", file2);
}
// The uploadURL is the URL received from Cloudflare
const { data } = await axios.post(uploadURL, imgForm, {
headers: {
ContentType: "multipart/form-data",
},
});