Where is the documentation for $fetch for both nitro server-side and client-side?

Specifically I need to know what to pass in the options object, but I can't find information on this. Searched around for it, but couldn't find it at a quick glace. not my fault here, it's a doc design fault. devs should be notified.
7 Replies
kapa.ai
kapa.ai2w ago
Hi @Thick Black W. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- The documentation for $fetch in Nuxt can be found at the official Nuxt docs under API > Utils > $fetch. This page explains that Nuxt uses ofetch to provide the $fetch helper globally, both for client-side and Nitro server-side usage. Where to Find Option Details However, the Nuxt documentation itself does not provide a detailed breakdown of the options object you can pass to $fetch. It mentions that $fetch is based on ofetch, and links to the ofetch documentation, which is where you will find the most comprehensive and up-to-date list of available options (such as method, headers, body, etc.) for both server and client usage. #### What the Nuxt Docs Say - The Nuxt docs show usage examples for $fetch and mention that it is based on ofetch, but do not enumerate all possible options or their types. They do show that you can pass options like method, body, and headers in code examples, but for a full reference, you are expected to consult the ofetch documentation Nuxt $fetch API. - During SSR, $fetch will not forward cookies or headers unless you do so manually, and the docs show how to do this with the headers option Nuxt $fetch API. #### Example Usage
// Client-side or server-side
await $fetch('/api/endpoint', {
method: 'POST',
headers: { 'Authorization': 'Bearer token' },
body: { foo: 'bar' }
})
// Client-side or server-side
await $fetch('/api/endpoint', {
method: 'POST',
headers: { 'Authorization': 'Bearer token' },
body: { foo: 'bar' }
})
Summary - Documentation location: Nuxt $fetch API - Full options reference: ofetch documentation - Nuxt docs do not list all options—they expect you to refer to ofetch for the complete API.
You are correct that the Nuxt docs could be improved by directly listing or linking to the available options for $fetch. This feedback is valid and could be raised as an issue or suggestion to the Nuxt team.
If you need to know exactly what options are available, please refer to the ofetch options documentation as the Nuxt docs do not provide a full list themselves Nuxt $fetch API. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai2w ago
<@1321238874634195004> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
Thick Black W
Thick Black WOP2w ago
@kapa.ai provide the options here
kapa.ai
kapa.ai2w ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- The Nuxt documentation for $fetch does not provide a full, explicit list of all available options you can pass to the options object. It does, however, show usage examples and mentions that $fetch is based on ofetch, which is where the full set of options is defined. The Nuxt docs demonstrate passing options such as method, headers, and body:
await $fetch('/api/endpoint', {
method: 'POST',
headers: { 'Authorization': 'Bearer token' },
body: { foo: 'bar' }
})
await $fetch('/api/endpoint', {
method: 'POST',
headers: { 'Authorization': 'Bearer token' },
body: { foo: 'bar' }
})
From the Nuxt documentation, the following options are shown or implied: - method: HTTP method (e.g., 'GET', 'POST') - headers: Object or Headers instance for custom headers - body: Request body (object will be stringified) - baseURL: Base URL for the request - timeout: Milliseconds to automatically abort request The documentation also notes that during SSR, $fetch will not forward cookies or headers unless you do so manually by passing them in the headers option Nuxt $fetch API. Important:
The Nuxt docs do not provide a comprehensive, detailed list of all possible options for $fetch. For the complete set of options, you are expected to refer to the ofetch documentation, as Nuxt's $fetch is a direct wrapper around it. If you need more detail than what is shown above, the knowledge sources do not contain enough information to provide a full, authoritative list of all $fetch options. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai2w ago
<@1321238874634195004> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
johntanzer
johntanzer2w ago
Hey. What exactly is not clear? Have you solved your issue?
Thick Black W
Thick Black WOP2w ago
what to pass in options. there isn't a complete list on what to pass in. i think this is due to the options being http vanilla options so they don't list them out. unfortunately, for a new dev, I jumped straight into nuxt after a simple vanilla project, vue project, and now nuxt. right now I am trying to figure out how to cache all the fetch calls 1st how much storage to dedicate to the caches. 2nd I need to make sure "error" fetched are not cached, how to read and send status codes. in express they explicitly force setting status codes as good practice, but nuxt docs don't show that. poor practice

Did you find this page helpful?