From 9507d80c90be2c6ba05df134ed673eacf020af54 Mon Sep 17 00:00:00 2001 From: Krutie Patel Date: Wed, 9 Nov 2022 15:36:08 +1000 Subject: [PATCH 1/4] docs(api): add userequestheaders composable example --- .../1.composables/use-request-headers.md | 20 ++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/docs/content/3.api/1.composables/use-request-headers.md b/docs/content/3.api/1.composables/use-request-headers.md index 90115ece837..31c9ca965a2 100644 --- a/docs/content/3.api/1.composables/use-request-headers.md +++ b/docs/content/3.api/1.composables/use-request-headers.md @@ -5,7 +5,7 @@ description: "Use useRequestHeaders to access the incoming request headers." # `useRequestHeaders` -Within your pages, components, and plugins you can use `useRequestHeaders` to access the incoming request headers. +You can use built-in `useRequestHeaders` composable to access the incoming request headers within your pages, components, and plugins. ```js // Get all request headers @@ -18,3 +18,21 @@ const headers = useRequestHeaders(['cookie']) ::alert{icon=👉} In the browser, `useRequestHeaders` will return an empty object. :: + +## Example + +We can use `useRequestHeaders` to access and proxy browser's `authorization` header to the server-side and also make sure that there are no unintended side effects during SSR. + +The example below adds an `authorization` request headers to an isomorphic `$fetch` call. + +```vue [pages/some-page.vue] + +``` + +::alert{icon=👉} +[Another example](/getting-started/data-fetching#example-pass-client-headers-to-the-api) shows how we can pass `cookie` from the client headers to the API. +:: From 55564451f24faead326693923bfa8dd926737867 Mon Sep 17 00:00:00 2001 From: Krutie Patel Date: Wed, 9 Nov 2022 19:06:34 +1000 Subject: [PATCH 2/4] Update docs/content/3.api/1.composables/use-request-headers.md Co-authored-by: Daniel Roe --- docs/content/3.api/1.composables/use-request-headers.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/3.api/1.composables/use-request-headers.md b/docs/content/3.api/1.composables/use-request-headers.md index 31c9ca965a2..bfc00090c83 100644 --- a/docs/content/3.api/1.composables/use-request-headers.md +++ b/docs/content/3.api/1.composables/use-request-headers.md @@ -21,7 +21,7 @@ In the browser, `useRequestHeaders` will return an empty object. ## Example -We can use `useRequestHeaders` to access and proxy browser's `authorization` header to the server-side and also make sure that there are no unintended side effects during SSR. +We can use `useRequestHeaders` to access and proxy the initial request's `authorization` header to any future internal requests during SSR. The example below adds an `authorization` request headers to an isomorphic `$fetch` call. From 5073709df91c94abde3637ce66b93785676673cf Mon Sep 17 00:00:00 2001 From: Krutie Patel Date: Wed, 9 Nov 2022 19:08:03 +1000 Subject: [PATCH 3/4] Update docs/content/3.api/1.composables/use-request-headers.md Co-authored-by: Daniel Roe --- docs/content/3.api/1.composables/use-request-headers.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/3.api/1.composables/use-request-headers.md b/docs/content/3.api/1.composables/use-request-headers.md index bfc00090c83..9fdfdd5bdb7 100644 --- a/docs/content/3.api/1.composables/use-request-headers.md +++ b/docs/content/3.api/1.composables/use-request-headers.md @@ -34,5 +34,5 @@ const { data } = await useFetch('/api/confidential', { ``` ::alert{icon=👉} -[Another example](/getting-started/data-fetching#example-pass-client-headers-to-the-api) shows how we can pass `cookie` from the client headers to the API. +[Another example](/getting-started/data-fetching#example-pass-client-headers-to-the-api) shows how we can pass cookies from the initial request to another API route. :: From a16e5ebd0570d9514d03a39883005dcbf996f2d3 Mon Sep 17 00:00:00 2001 From: Krutie Patel Date: Wed, 9 Nov 2022 19:08:35 +1000 Subject: [PATCH 4/4] Update docs/content/3.api/1.composables/use-request-headers.md Co-authored-by: Daniel Roe --- docs/content/3.api/1.composables/use-request-headers.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/3.api/1.composables/use-request-headers.md b/docs/content/3.api/1.composables/use-request-headers.md index 9fdfdd5bdb7..4b928a8fa21 100644 --- a/docs/content/3.api/1.composables/use-request-headers.md +++ b/docs/content/3.api/1.composables/use-request-headers.md @@ -23,7 +23,7 @@ In the browser, `useRequestHeaders` will return an empty object. We can use `useRequestHeaders` to access and proxy the initial request's `authorization` header to any future internal requests during SSR. -The example below adds an `authorization` request headers to an isomorphic `$fetch` call. +The example below adds the `authorization` request header to an isomorphic `$fetch` call. ```vue [pages/some-page.vue]