fix(nuxt): improve return type of useRequestEvent (#25480)

docs/1.getting-started/6.data-fetching.md

@@ -462,7 +462,7 @@ export const fetchWithCookie = async (event: H3Event, url: string) => {
 // This composable will automatically pass cookies to the client
 const event = useRequestEvent()
 
-const { data: result } = await useAsyncData(() => fetchWithCookie(event, '/api/with-cookie'))
+const { data: result } = await useAsyncData(() => fetchWithCookie(event!, '/api/with-cookie'))
 
 onMounted(() => console.log(document.cookie))
 </script>

docs/3.api/2.composables/use-request-event.md

@@ -15,7 +15,7 @@ Within your pages, components, and plugins you can use `useRequestEvent` to acce
 const event = useRequestEvent()
 
 // Get the URL
-const url = event.path
+const url = event?.path
 ```
 
 ::callout

docs/3.api/3.utils/set-response-status.md

@@ -15,11 +15,14 @@ Nuxt provides composables and utilities for first-class server-side-rendering su
 ```js
 const event = useRequestEvent()
 
-// Set the status code to 404 for a custom 404 page
-setResponseStatus(event, 404)
+// event will be undefined in the browser
+if (event) {
+  // Set the status code to 404 for a custom 404 page
+  setResponseStatus(event, 404)
 
-// Set the status message as well
-setResponseStatus(event, 404, 'Page Not Found')
+  // Set the status message as well
+  setResponseStatus(event, 404, 'Page Not Found')
+}
 ```
 
 ::callout

packages/nuxt/src/app/components/nuxt-island.ts

@@ -83,7 +83,7 @@ export default defineComponent({
     const event = useRequestEvent()
 
     // TODO: remove use of `$fetch.raw` when nitro 503 issues on windows dev server are resolved
-    const eventFetch = import.meta.server ? event.fetch : import.meta.dev ? $fetch.raw : globalThis.fetch
+    const eventFetch = import.meta.server ? event!.fetch : import.meta.dev ? $fetch.raw : globalThis.fetch
     const mounted = ref(false)
     onMounted(() => { mounted.value = true; teleportKey.value++ })
 
@@ -168,7 +168,7 @@ export default defineComponent({
       if (import.meta.server && import.meta.prerender) {
         const hints = r.headers.get('x-nitro-prerender')
         if (hints) {
-          appendResponseHeader(event, 'x-nitro-prerender', hints)
+          appendResponseHeader(event!, 'x-nitro-prerender', hints)
         }
       }
       setPayload(key, result)

packages/nuxt/src/app/composables/cookie.ts

@@ -111,7 +111,7 @@ export function useCookie<T = string | null | undefined> (name: string, _opts?:
     const nuxtApp = useNuxtApp()
     const writeFinalCookieValue = () => {
       if (opts.readonly || isEqual(cookie.value, cookies[name])) { return }
-      writeServerCookie(useRequestEvent(nuxtApp), name, cookie.value, opts as CookieOptions<any>)
+      writeServerCookie(useRequestEvent(nuxtApp)!, name, cookie.value, opts as CookieOptions<any>)
     }
     const unhook = nuxtApp.hooks.hookOnce('app:rendered', writeFinalCookieValue)
     nuxtApp.hooks.hookOnce('app:error', () => {
@@ -131,7 +131,7 @@ export function refreshCookie(name: string) {
 
 function readRawCookies (opts: CookieOptions = {}): Record<string, unknown> | undefined {
   if (import.meta.server) {
-    return parse(getRequestHeader(useRequestEvent(), 'cookie') || '', opts)
+    return parse(getRequestHeader(useRequestEvent()!, 'cookie') || '', opts)
   } else if (import.meta.client) {
     return parse(document.cookie, opts)
   }

packages/nuxt/src/app/composables/ssr.ts

@@ -5,8 +5,8 @@ import { useNuxtApp } from '../nuxt'
 import { toArray } from '../utils'
 
 /** @since 3.0.0 */
-export function useRequestEvent (nuxtApp: NuxtApp = useNuxtApp()): H3Event {
-  return nuxtApp.ssrContext?.event as H3Event
+export function useRequestEvent (nuxtApp: NuxtApp = useNuxtApp()) {
+  return nuxtApp.ssrContext?.event
 }
 
 /** @since 3.0.0 */
@@ -52,7 +52,10 @@ export function setResponseStatus (arg1: H3Event | number | undefined, arg2?: nu
   if (arg1 && typeof arg1 !== 'number') {
     return _setResponseStatus(arg1, arg2 as number | undefined, arg3)
   }
-  return _setResponseStatus(useRequestEvent(), arg1, arg2 as string | undefined)
+  const event = useRequestEvent()
+  if (event) {
+    return _setResponseStatus(event, arg1, arg2 as string | undefined)
+  }
 }
 
 /** @since 3.8.0 */
@@ -60,5 +63,5 @@ export function prerenderRoutes (path: string | string[]) {
   if (!import.meta.server || !import.meta.prerender) { return }
 
   const paths = toArray(path)
-  appendHeader(useRequestEvent(), 'x-nitro-prerender', paths.map(p => encodeURIComponent(p)).join(', '))
+  appendHeader(useRequestEvent()!, 'x-nitro-prerender', paths.map(p => encodeURIComponent(p)).join(', '))
 }

packages/nuxt/src/app/composables/url.ts

@@ -6,7 +6,7 @@ import { useRequestEvent } from './ssr'
 /** @since 3.5.0 */
 export function useRequestURL () {
   if (import.meta.server) {
-    const url = getRequestURL(useRequestEvent())
+    const url = getRequestURL(useRequestEvent()!)
     url.pathname = joinURL(useRuntimeConfig().app.baseURL, url.pathname)
     return url
   }

test/fixtures/basic-types/modules/runtime/page.vue

@@ -8,7 +8,7 @@ definePageMeta({
 })
 
 if (import.meta.server) {
-  setResponseHeader(useRequestEvent(), 'x-extend', useRoute().meta.value as string)
+  setResponseHeader(useRequestEvent()!, 'x-extend', useRoute().meta.value as string)
 }
 </script>
 

test/fixtures/basic/components/islands/LongAsyncComponent.vue

@@ -49,6 +49,6 @@ defineProps<{
 }>()
 
 const evt = useRequestEvent()
-const headers = getResponseHeaders(evt)
+const headers = evt ? getResponseHeaders(evt) : {}
 const { data } = await useFetch('/api/very-long-request')
 </script>

test/fixtures/basic/modules/runtime/page.vue

@@ -8,7 +8,7 @@ definePageMeta({
 })
 
 if (import.meta.server) {
-  setResponseHeader(useRequestEvent(), 'x-extend', useRoute().meta.value as string)
+  setResponseHeader(useRequestEvent()!, 'x-extend', useRoute().meta.value as string)
 }
 </script>
 

test/fixtures/basic/plugins/server-only.server.ts

@@ -4,7 +4,9 @@ export default defineNuxtPlugin({
   name: 'server-only-plugin',
   setup () {
     const evt = useRequestEvent()
-    setHeader(evt, 'custom-head', 'hello')
+    if (evt) {
+      setHeader(evt, 'custom-head', 'hello')
+    }
   },
   env: {
     islands: false