Giters

unjs / ofetch

😱 A better fetch API. Works on node, browser and workers.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Body in options object in $fetch method from NUXT3 not available in request to server

adamkpurdy opened this issue · comments

commented

Environment

node: v18.16.0

package.json

{
  "name": "nuxt-app",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "dev:debug": " npx nuxi dev --inspect",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "dependencies": {
    "nuxt": "^3.11.2",
    "vue": "^3.4.27",
    "vue-router": "^4.3.2"
  }
}

Reproduction

Repo: https://github.com/usssa-org/nuxt-bug

  • Create a new test Nuxt App: npx nuxi@latest init
  • Add an API folder in the server with an endpoint called "test"
  • Simple click handler on a button on the home page that makes an API call to the test method
await $fetch('/api/test', {
    method: 'POST',
    body: {
      foo: 'bar'
    }
  })

Network tab recognizes the request payload, but is not seen in the server on breakpoint
Screenshot 2024-06-10 at 6 46 13 PM
Screenshot 2024-06-10 at 6 46 34 PM

Describe the bug

I've found useFetch very useful for my current green field application development, but when I needed to pass an id in the body I followed the Nuxt3 docs stating I should be using $fetch which is utilizing ofetch.

In my real app I am using a composable to make the call using $fetch, and when I go to pass the body field in the options object I can not see the body field in the server api code.

I've looked in multiple spot when paused in the server from the client call.

Additional context

I stripped away everything and just have a very basic Nuxt3 app with a simple API endpoint.

Please let me know if I am missing something very simple. I've been digging for hours looking at all docs and reported bugs.

Logs

No response