Is it possible to upload multiple files? #3384

branislav-brincko · 2024-09-05T13:53:19Z

branislav-brincko
Sep 5, 2024

Docs talk about uploading a SINGLE file:

Is it possible to upload multiple files though? My frontend code:

<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>File Upload</title>
	</head>
	<body>
		<form id="uploadForm" enctype="multipart/form-data">
			<input type="file" id="files" name="files" multiple />
			<button type="button" onclick="uploadFiles()">Upload</button>
		</form>

		<script>
			function uploadFiles() {
				const filesInput = document.getElementById('files')
				const formData = new FormData()

				// Append all selected files to the formData
				for (let i = 0; i < filesInput.files.length; i++) {
					formData.append('file', filesInput.files[i])
				}

				// Use Fetch API to send files to the backend
				fetch('http://localhost:3000/api/forms/test-form', {
					method: 'POST',
					body: formData,
				})
					.then((response) => response.json())
					.then((data) => console.log(data))
					.catch((error) => console.error('Error:', error))
			}
		</script>
	</body>
</html>

Hono:

	.post('/test-form', async (c) => {
		const body = await c.req.parseBody()
		const { files } = body
		console.log('files', files)
		return c.json({ ok: 'ok' })
	})

The logged "files" property is always a single file.

Can we handle mutliple files somehow?

Thanks 🙏

branislavbrincko · 2024-09-07T10:26:44Z

branislavbrincko
Sep 7, 2024

I found the answer - https://hono.dev/docs/api/request#multiple-files-with-same-name

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Hono

Is it possible to upload multiple files? #3384

Uh oh!

{{title}}

Uh oh!

Replies: 1 comment

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

Hono

Is it possible to upload multiple files? #3384

Uh oh!

branislav-brincko Sep 5, 2024

Replies: 1 comment

Uh oh!

branislavbrincko Sep 7, 2024

branislav-brincko
Sep 5, 2024

branislavbrincko
Sep 7, 2024