cannot send FormData in `$fetch` body

[RijaCloud]

Environment

Operating System: Windows 10 Node Version: v14.16.1 Nuxt Version: 3.0.0-rc.08 Builder: vite Runtime Modules: - Build Modules: -

Reproduction

• Create a new nuxt3 project ( doesn't matter if you are using rc10 )
• Create a new simple component to upload an image
• Put in the component an input type file like as follows : <input type="file" id="file-input" multiple @change="onInputChange" />
• Add a script tag and create a new method onInputChange like this : onInputChange (e) { const file = e.target.files await $fetch('/api/uploadFile', { method: "POST", body: { files: file }, headers : { "Content-Type": "multipart/form-data" } }) }
• After that create a new ssr api in the server/api directory like this :

import FormData from "form-data"; import { manageErrorServer } from "~~/utils/manageErrorServer"; export default defineEventHandler(async (event) => { const config = useRuntimeConfig(); const body = await useBody(event); try{ const res: Record<string, any> = await $fetch( ${config.API_BASE_URL}+"smart-product",{ method: 'POST', body: body, headers: { "Content-Type": "mutlipart/form-data" } } ) return res } catch (e) { console.log("erreur " + e.response) manageErrorServer(e); } });

Describe the bug

The multipart/form-data is not sent by $fetch, either on the first call to the ssr api or on the second call to the backend

Additional context

No response

Logs

No response

[danielroe]

Let's follow upstream issue on https://github.com/unjs/ohmyfetch/issues/37.

[huang-julien]

Hi doesn't this work when setting a FormData to the body ? I use the solution provided here https://github.com/nuxt/framework/discussions/4409#discussioncomment-2679474

[RijaCloud]

Hi thanks for the answer, @danielroe I tried your solution but it still doesn't work on my side

[ivanempire]

Chiming in here - seeing similar issues on my end where the content-type header is not respected (tried using FormData, querystring, regular body object...). If anyone wants to unblock themselves, axios works as expected...