From aba32c75410b4021361274da15a4e9591ac8e191 Mon Sep 17 00:00:00 2001 From: Alex Kozack Date: Mon, 12 Dec 2022 15:17:28 +0200 Subject: [PATCH] docs: Replace regular `fetch` with a `$fetch` from nuxt This feature was implementet in https://github.com/wobsoriano/trpc-nuxt/pull/28 and describe better way to work with ssr --- docs/content/1.get-started/2.usage.md | 28 +++++++++++++++++++++++---- 1 file changed, 24 insertions(+), 4 deletions(-) diff --git a/docs/content/1.get-started/2.usage.md b/docs/content/1.get-started/2.usage.md index 40f1918..9c2d738 100644 --- a/docs/content/1.get-started/2.usage.md +++ b/docs/content/1.get-started/2.usage.md @@ -98,11 +98,31 @@ export default defineNuxtPlugin(() => { const client = createTRPCProxyClient({ links: [ httpBatchLink({ + url: '/api/trpc', + + /** - * If you want to use SSR, you need to use the server's full URL - * @link https://trpc.io/docs/ssr - **/ - url: 'http://localhost:3000/api/trpc', + * Replace regular `fetch` with a `$fetch` from nuxt + * + * During server-side rendering, calling $fetch to fetch your internal API routes + * will directly call the relevant function (emulating the request), + * saving an additional API call. + * + * @see https://nuxt.com/docs/api/utils/dollarfetch + */ + fetch: (input, options) => + globalThis.$fetch.raw(input.toString(), options) + .catch((e) => { + if (e instanceof FetchError && e.response) + return e.response + + throw e + }) + .then(response => ({ + ...response, + json: () => Promise.resolve(response._data), + })), + }), ], })