Using DELETE cause 405 error while POST works in S3

I am trying to implement a image hosting function using AWS S3 and Hono for API endpoints with NextJS on top.
When I building a delete function, if I define the API on server as delete, it won’t work and produces 405 error. In contrast, using post won’t cause any issue and it works. But in my understanding, defining post, delete or put is required for semantic purposes.
Below is my implementation:
Server-side (Hono):

const mediaS3App = new Hono()
.delete('/delete', async (c) => {
        try {
            const fileName = c.req.query('fileName');

            if (!fileName) {
                return c.json({error: 'File name required.'}, 400)
            }

            const result = await getSignedURL(fileName, 'DELETE')

            if (result.failure) {
                return c.json({error: result.failure}, 401)
            }
            return c.json({url: result.success?.url})
        } catch (error) {
            console.error('Server error:', error);
            return c.json({error: 'An unexpected error occurred.'}, 500)
        }
    })

Client-side:

await Promise.all(fileSelected.map(async (fileName, i) => {
            try {
                const DELURLResponse = await fetch(`/api/images/delete?fileName=${encodeURIComponent(fileName)}`, {
                    method: 'DELETE',
                });

                const DELSignedURL = await DELURLResponse.json();
                if (DELURLResponse.ok && DELSignedURL.url) {
                    const deleteResponse = await fetch(DELSignedURL.url, {
                        method: 'DELETE',
                    });
                    if (deleteResponse.ok) {
                        console.log('delete successful')
                    } else {
                        console.log('error on deletetion')
                    }
                } else {
                    console.error('Failed to delete, something wrong with delete presigned URL', DELSignedURL.error);
                }
            } catch (error) {
                console.error('An error occurred during the deletion:', error);
            }
        }))

It would work If I change to route to post

.post('/delete', async (c) => {
....

await Promise.all(fileSelected.map(async (fileName, i) => {
            try {
                const DELURLResponse = await fetch(`/api/upload/delete?fileName=${encodeURIComponent(fileName)}`, {
                method: 'POST',
            });