Rate limit (429)

Map 429 in createStatusInterceptor from tanstack-fetch/plugins.

import { createFetch, parseRetryAfter } from 'tanstack-fetch'
import { createStatusInterceptor } from 'tanstack-fetch/plugins'

export const api = createFetch({
  baseUrl: import.meta.env.VITE_API_URL,
  maxRetries: 2,
  interceptors: [
    createStatusInterceptor({
      429: ({ context }) => {
        const delayMs = parseRetryAfter(context.response?.headers, 1000)
        // Option A — let the error throw (Query shows isError)
        console.warn('429 — wait', delayMs, 'ms')

        // Option B — ask the status interceptor to retry once
        // return { action: 'retry', delayMs }
      },
      '4xx': ({ status }) => {
        // any other 4xx without its own handler
        console.warn('4xx', status)
      },
    }),
  ],
})

TIP

createFetch from tanstack-fetch/sse / /live, createTRPCFetch options and the framework providers still accept the onTooManyRequests / onClientError shortcuts.

Retry with Retry-After

createStatusInterceptor({
  429: ({ context }) => ({
    action: 'retry',
    delayMs: parseRetryAfter(context.response?.headers, 2000),
  }),
})

parseRetryAfter accepts delay-seconds (3) or an HTTP-date and returns milliseconds.

Try it

Open the live playground and click 429.

Related: Configuration · Errors