37% OFF during Black Friday at Mastering Nuxt.

useRequestFetch

Передавайте контекст запроса и заголовки для серверных fetch запросов с помощью композабла useRequestFetch.

Вы можете использовать useRequestFetch для передачи контекста запроса и заголовков при выполнении fetch запросов на стороне сервера.

При выполнении fetch запроса на стороне клиента, браузер автоматически отправляет необходимые заголовки. Однако при выполнении запроса во время рендеринга на стороне сервера, поскольку запрос выполняется на сервере, нам нужно пересылать заголовки вручную.

Заголовки, которые не предназначены для пересылки, не будут включены в запрос. К таким заголовкам относятся, например: transfer-encoding, connection, keep-alive, upgrade, expect, host, accept
Композабл useFetch использует useRequestFetch под капотом для автоматической передачи контекста и заголовков запроса.
<script setup lang="ts">
  // Это перенаправит заголовки пользователя в обработчик события `/api/foo`
  // Результат: { cookies: { foo: 'bar' } }
  const requestFetch = useRequestFetch()
  const { data: forwarded } = await useAsyncData(() => requestFetch('/api/cookies'))
  
  // Это НЕ пересылает ничего
  // Результат: { cookies: {} }
  const { data: notForwarded } = await useAsyncData(() => $fetch('/api/cookies')) 
</script>
В браузере при навигации на клиенте, useRequestFetch будет вести себя так же, как и обычный $fetch.