Caching ​

You can cache your API responses to improve performance between multiple calls like for page navigation.

Caching Strategy ​

Both generated composables will calculate a cache key based on the following properties:

• API endpoint ID
• Path
• Path Parameters (if OpenAPI type generation is enabled)
• Query
• HTTP method
• Body

If the cache key is already present in the cache, the cached response will be returned instead of making a new API call.

Cache Options ​

You can disable the cache for each request by setting the cache option to false. This is necessary for the useMyApiData composable:

// Disable caching for a single request
const { data } = await useJsonPlaceholderData('posts/1', {
  cache: false
})

// Disable caching for a single request
const { data } = await useJsonPlaceholderData('posts/1', {
  cache: false
})

// `nuxt.config.ts`
export default defineNuxtConfig({
  modules: ['nuxt-api-party'],

  apiParty: {
    endpoints: {
      jsonPlaceholder: {
        url: 'https://jsonplaceholder.typicode.com'
      }
    }
  }
})

// `nuxt.config.ts`
export default defineNuxtConfig({
  modules: ['nuxt-api-party'],

  apiParty: {
    endpoints: {
      jsonPlaceholder: {
        url: 'https://jsonplaceholder.typicode.com'
      }
    }
  }
})

Although the $myApi composables are intended for one-time API calls, like submitting form data, you can also cache their responses when needed:

// Enable cache for a single request
const response = $jsonPlaceholder('posts/1', {
  method: 'POST',
  body: {
    foo: 'bar'
  },
  cache: true
})

// Enable cache for a single request
const response = $jsonPlaceholder('posts/1', {
  method: 'POST',
  body: {
    foo: 'bar'
  },
  cache: true
})

Invalidate Cache On Error ​

If a request fails, the cache will be invalidated by default. This means that the next request will not return the cached response, but make a new API call instead.